Aktifkan pemformatan teks di Connect Customer untuk pengalaman obrolan pelanggan Anda

Saat Anda membuat antarmuka pengguna obrolan baru, pemformatan teks kaya diaktifkan di luar kotak. Tidak diperlukan konfigurasi tambahan.

Untuk menambahkan kemampuan pemformatan teks ke antarmuka pengguna obrolan yang ada, perbarui kode widget komunikasi dengan kode berikut yang disorot dengan huruf tebal:

    (function(w, d, x, id){
        s=d.createElement('script');
        s.src='https://your-instance-alias.my.connect.aws/connectwidget/static/amazon-connect-chat-interface-client.js';
        s.async=1;
        s.id=id;
        d.getElementsByTagName('head')[0].appendChild(s);
        w[x] =  w[x] || function() { (w[x].ac = w[x].ac || []).push(arguments) };
    })(window, document, 'amazon_connect', 'widget-id');
    amazon_connect('styles', { openChat: { color: 'white', backgroundColor: '#123456'}, closeChat: { color: 'white', backgroundColor: '#123456'} });
    amazon_connect('snippetId', 'snippet-id');
    amazon_connect('supportedMessagingContentTypes', [ 'text/plain', 'text/markdown' ]);
                

Kode yang disorot dengan warna merah diatur ke nilai yang benar saat Anda mendapatkan cuplikan dari konsol Connect Customer. Satu-satunya konten yang Anda pilih untuk ditambahkan atau dihapus adalah baris terakhir yang dicetak tebalsupportedMessagingContentTypes.

Untuk menambahkan kemampuan pemformatan teks ke antarmuka pengguna obrolan kustom Anda sendiri (misalnya, Antarmuka Obrolan atau solusi UI Anda sendiri di atas ChatJS), ikuti langkah-langkah berikut:

1. Panggil StartChatContact API. Saat memanggilStartChatContact, tambahkan SupportedMessagingContentTypes parameter seperti yang ditunjukkan dalam huruf tebal dalam contoh berikut:

   // Connect Customer StartChatContact API
   {
       "Attributes": { 
           "string" : "string" 
       },
       "ClientToken": "string",
       "ContactFlowId": "your flow ID",
       "InitialMessage": { 
           "Content": "string",
           "ContentType": "string"
       },
       "InstanceId": "your instance ID",
       "ParticipantDetails": { 
           "DisplayName": "string"
       }
       
       // optional
      "SupportedMessagingContentTypes": [ "text/plain", "text/markdown" ]
   }

2. Imp chatjs or sebagai objek, seperti yang ditunjukkan dalam contoh berikut:

   import "amazon-connect-chatjs";
   
   this.session = connect.ChatSession.create({
         ...
       });
   
   this.session.sendMessage({
         message: "message-in-markdown-format",
         contentType: "text/markdown"
   });           

   Jika tidak menggunakan ChatJs, lihat topik berikut untuk informasi tentang pengiriman teks penurunan harga melalui Connect Customer API: StartChatContact dan SendMessage.

3. Kirim pesan dengan penurunan harga. Lihat cuplikan kode sebelumnya untuk mengimpor chatjs sebagai objek untuk contoh cara mengirim pesan. Anda dapat menggunakan penurunan harga sederhana untuk memformat teks dalam obrolan. Jika Anda sudah menggunakan chatjs hari ini untuk mengirim pesan teks biasa, Anda dapat mengubah logika yang ada untuk dipanggil text/markdown sebagai SendMessage alih- contentType alih text/plain ketika Anda ingin mengirim pesan penurunan harga. Pastikan untuk memperbarui sendMessage parameter untuk memiliki format penurunan harga pesan Anda. Untuk informasi selengkapnya, lihat Panduan Markdown Basic Syntax.

4. Terapkan logika Anda sendiri dalam paket UI untuk membuat pesan penurunan harga di area input dan transkrip obrolan. Jika Anda menggunakan React, Anda dapat menggunakan react-markdown sebagai referensi.