

Terjemahan disediakan oleh mesin penerjemah. Jika konten terjemahan yang diberikan bertentangan dengan versi bahasa Inggris aslinya, utamakan versi bahasa Inggris.

# Aktifkan pemformatan teks di Amazon Connect untuk pengalaman obrolan pelanggan Anda
<a name="enable-text-formatting-chat"></a>

Dengan pemformatan pesan Amazon Connect, Anda dapat memungkinkan pelanggan dan agen Anda untuk dengan cepat menambahkan struktur dan kejelasan ke pesan obrolan mereka. 

**Topics**
+ [Jenis pemformatan yang didukung](#supported-format-types)
+ [Aktifkan pemformatan pesan](#how-to-enable-message-formatting)
+ [Cara menambahkan tautan email dan telepon](#add-email-phone-links)
+ [Cara menambahkan pesan chatbot](#add-bot-messages)

## Jenis pemformatan yang didukung
<a name="supported-format-types"></a>

Anda dapat memberikan jenis pemformatan berikut pada antarmuka pengguna obrolan dan aplikasi agen menggunakan penurunan harga:
+ Berani
+ Miring
+ Daftar berpoin
+ Daftar bernomor
+ Hyperlink
+ Emoji
+ Lampiran. Untuk mengaktifkan lampiran, ikuti[Aktifkan lampiran di PKC Anda sehingga pelanggan dan agen dapat berbagi dan mengunggah file](enable-attachments.md).

## Cara mengaktifkan pemformatan pesan
<a name="how-to-enable-message-formatting"></a>

1. Saat Anda membuat [antarmuka pengguna obrolan](add-chat-to-website.md) baru, pemformatan teks kaya diaktifkan di luar kotak. Tidak diperlukan konfigurasi tambahan.

1. Untuk menambahkan kemampuan pemformatan teks ke [antarmuka pengguna obrolan](add-chat-to-website.md) yang ada, perbarui [kode widget komunikasi dengan kode](add-chat-to-website.md) berikut yang disorot dalam 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 Amazon Connect. Satu-satunya konten yang Anda pilih untuk ditambahkan atau dihapus adalah baris terakhir yang dicetak tebal`supportedMessagingContentTypes`. 

1. Untuk menambahkan kemampuan pemformatan teks ke antarmuka pengguna obrolan kustom Anda sendiri (misalnya, [Antarmuka Obrolan](https://github.com/amazon-connect/amazon-connect-chat-interface) atau solusi UI Anda sendiri di atas [ChatJS](https://github.com/amazon-connect/amazon-connect-chatjs)), ikuti langkah-langkah berikut: 

   1. Panggil [StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)API. Saat memanggil`StartChatContact`, tambahkan `SupportedMessagingContentTypes` parameter seperti yang ditunjukkan dalam huruf tebal dalam contoh berikut:

      ```
      // Amazon Connect 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" ]
      }
      ```

   1. Impor `chatjs` sebagai objek, seperti yang ditunjukkan pada contoh berikut:

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

      Jika Anda tidak menggunakan ChatJs, lihat topik berikut untuk informasi tentang mengirim teks penurunan harga melalui Amazon Connect APIs: [StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html)dan [SendMessage](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_SendMessage.html).

   1. 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](https://github.com/amazon-connect/amazon-connect-chatjs/blob/master/src/core/chatController.js#L66), Anda dapat memodifikasi logika yang ada untuk memanggil [SendMessage](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_SendMessage.html)`text/markdown`sebagai `contentType` alih-alih `text/plain` ketika Anda ingin mengirim pesan penurunan harga. Pastikan untuk memperbarui `sendMessage` parameter agar memiliki format penurunan harga pesan Anda. Untuk informasi selengkapnya, lihat [Panduan Penurunan Harga Sintaks Dasar](https://www.markdownguide.org/basic-syntax/).

   1. Terapkan logika Anda sendiri dalam paket UI untuk merender pesan penurunan harga di area input dan transkrip obrolan. Jika Anda menggunakan React, Anda dapat menggunakan [react-markdown](https://github.com/remarkjs/react-markdown) sebagai referensi.

**catatan**  
Kemampuan pemformatan teks muncul ke agen Anda hanya jika fitur tersebut telah diaktifkan untuk pelanggan Anda di antarmuka pengguna obrolan. Jika pemformatan teks tidak didukung atau diaktifkan pada antarmuka pengguna obrolan pelanggan, agen tidak akan memiliki kemampuan untuk menulis dan mengirim pesan dengan format teks.
Semua kemampuan pemformatan teks kecuali lampiran tersedia untuk respons [cepat](create-quick-responses.md).

## Cara menambahkan tautan email dan telepon
<a name="add-email-phone-links"></a>

Contoh berikut menunjukkan cara menambahkan tautan yang dapat diklik dan dapat dipanggil ke web dan aplikasi seluler Anda.

```
Call us today: [+1 (123) 456-7890](tel:+11234567890)
[Call Us](tel:+11234567890)
[Skype Us](callto:+91123-456-7890)
[Fax Us](fax:+91123-456-7890)
[Text Us](SMS:+91123-456-7890)
[Email Us](mailto:name@email.com)
```

## Cara menambahkan pesan chatbot
<a name="add-bot-messages"></a>

Saat mengaktifkan penurunan harga untuk pesan obrolan, Anda dapat menggunakan pemformatan teks kaya untuk jenis pesan chatbot berikut:
+ [Mainkan alur prompt](play.md)
+ [Dapatkan alur masukan pelanggan](get-customer-input.md)
+ `SYSTEM_MESSAGE`
+ `Lex BOT`
+ `Third Party BOT`
+ `Lex BOT Lambda`

Gambar berikut menunjukkan cara mengaktifkan prompt secara manual di blok aliran [prompt Play](play.md):

![\[Gambar blok aliran dan prompt dengan 2 tautan, satu untuk FAQ dan satu lagi untuk nomor telepon.\]](http://docs.aws.amazon.com/id_id/connect/latest/adminguide/images/chat-rtf-play-prompt-flow-1.png)


Gambar berikut menunjukkan cara mengaktifkan prompt secara manual di blok aliran [input Dapatkan pelanggan](get-customer-input.md), lalu kaitkan blok aliran dengan bot Amazon Lex:

![\[Gambar blok aliran dan prompt dengan 2 tautan, satu untuk FAQ dan satu lagi untuk nomor telepon.\]](http://docs.aws.amazon.com/id_id/connect/latest/adminguide/images/chat-rtf-get-customer-flow.png)


Gambar berikut menunjukkan bagaimana prompt muncul di SYSTEM\$1MESSAGE dan berbagai jenis pesan BOT:

![\[Gambar yang menunjukkan tautan “Tinjau FAQ kami” dan “hubungi kami” di pesan SYSTEM dan BOT.\]](http://docs.aws.amazon.com/id_id/connect/latest/adminguide/images/chat-rtf-sys-bot-messages.png)


Gambar berikut menunjukkan cara mengatur prompt dalam maksud bot Amazon Lex:

![\[Gambar maksud Amazon Lex yang berisi prompt dengan 2 tautan, satu untuk FAQ dan satu lagi untuk nomor telepon.\]](http://docs.aws.amazon.com/id_id/connect/latest/adminguide/images/chat-rtf-lex-flow.png)


Untuk informasi selengkapnya tentang maksud, lihat [Menambahkan maksud di Panduan](https://docs.aws.amazon.com/lexv2/latest/dg/add-intents.html) *Pengembang Amazon Lex V2*. Untuk informasi selengkapnya tentang pesan Lambda, lihat [Mengaktifkan logika kustom dengan fungsi AWS Lambda](https://docs.aws.amazon.com/lexv2/latest/dg/lambda.html), juga di Panduan Pengembang *Amazon* Lex V2.