

本文為英文版的機器翻譯版本，如內容有任何歧義或不一致之處，概以英文版為準。

# 在 Amazon Connect 中為客戶的聊天體驗啟用文字格式
<a name="enable-text-formatting-chat"></a>

透過 Amazon Connect 訊息格式化，您可以讓客戶和客服人員快速為其聊天訊息添加結構和清晰度。

**Topics**
+ [支援的格式類型](#supported-format-types)
+ [啟用訊息格式](#how-to-enable-message-formatting)
+ [如何新增電子郵件和電話連結](#add-email-phone-links)
+ [如何新增聊天機器人訊息](#add-bot-messages)

## 支援的格式類型
<a name="supported-format-types"></a>

您可以使用 Markdown，在聊天使用者介面和客服人員應用程式中提供下列類型的格式：
+ 粗體
+ 斜體
+ 項目符號清單
+ 編號清單
+ 超連結
+ 表情符號
+ 附件。要啟用附件，請遵循 [在 CCP 中啟用附件，讓客戶和客服人員能夠共用和上傳檔案](enable-attachments.md)。

## 如何啟用訊息格式
<a name="how-to-enable-message-formatting"></a>

1. 當您建立新的[聊天使用者介面](add-chat-to-website.md)時，即可啟用現成的 RTF 格式設定。不需任何其他設定。

1. 若要將文字格式設定功能新增至現有的[聊天使用者介面](add-chat-to-website.md)，請使用以下粗體反白標示的程式碼來更新[通訊小工具程式碼](add-chat-to-website.md)：

   ```
       (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' ]);
   ```

   當您從 Amazon Connect 主控台取得程式碼片段時，以紅色醒目顯示的程式碼會設定為正確的值。您選擇添加或刪除的唯一內容是最後一行粗體的 `supportedMessagingContentTypes`。

1. 若要將文字格式設定功能新增至您自己的自訂聊天使用者介面 (例如[聊天介面](https://github.com/amazon-connect/amazon-connect-chat-interface)或在 [ChatJS](https://github.com/amazon-connect/amazon-connect-chatjs) 之上您自己的 UI 解決方案)，請依照下列步驟執行：

   1. 呼叫 [StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html) API。呼叫 `StartChatContact` 時，請加入下列範例中粗體顯示的 `SupportedMessagingContentTypes` 參數：

      ```
      // 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. 匯入 `chatjs` 為物件，如以下範例所示：

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

      如果您不使用 ChatJS，請參閱以下主題，以取得有關透過 Amazon Connect API 傳送 Markdown 文字的資訊：[StartChatContact](https://docs.aws.amazon.com/connect/latest/APIReference/API_StartChatContact.html) 和 [SendMessage](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_SendMessage.html)。

   1. 使用 Markdown 傳送訊息。如需如何傳送訊息的範例，請參閱先前以物件形式匯入 `chatjs` 的程式碼片段。您可以使用簡單的 Markdown 來格式化聊天中的文字。如果您[今天已經使用 chatjs 傳送純文字訊息](https://github.com/amazon-connect/amazon-connect-chatjs/blob/master/src/core/chatController.js#L66)，則可修改現有的邏輯，當您要傳送 Markdown 訊息時呼叫 [SendMessage](https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_SendMessage.html)，並將 `text/markdown` (而非 `text/plain`) 作為 `contentType`。請務必更新 `sendMessage` 參數，使其具有訊息的 Markdown 格式。如需詳細資訊，請參閱 [Markdown 指南基本語法](https://www.markdownguide.org/basic-syntax/)。

   1. 在 UI 套件中實作您自己的邏輯，以便在輸入區域和聊天文字記錄中呈現 Markdown 訊息。如果你使用 React，你可以使用 [react-markdown](https://github.com/remarkjs/react-markdown) 作為參考。

**注意**  
只有在聊天使用者介面中為您的客戶啟用該功能時，客服人員才能顯示文字格式化功能。如果客戶聊天使用者介面不支援或未啟用文字格式設定，客服人員將無法撰寫和傳送具有文字格式的訊息。
除附件外，所有文字格式設定功能均適用[快速回應](create-quick-responses.md)。

## 如何新增電子郵件和電話連結
<a name="add-email-phone-links"></a>

下列範例說明如何將可點選和可呼叫的連結新增至您的 Web 和行動應用程式。

```
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)
```

## 如何新增聊天機器人訊息
<a name="add-bot-messages"></a>

啟用聊天訊息的 Markdown 時，您可以對下列類型的聊天機器人訊息使用 RTF 格式：
+ [播放提示](play.md)流程
+ [取得客戶輸入](get-customer-input.md)流程
+ `SYSTEM_MESSAGE`
+ `Lex BOT`
+ `Third Party BOT`
+ `Lex BOT Lambda`

下圖顯示如何在[播放提示](play.md)流程區塊中手動啟用提示：

![\[此圖顯示一個流程區塊、一個提示與 2 個連結，一個用於常見問答集，另一個用於電話號碼。\]](http://docs.aws.amazon.com/zh_tw/connect/latest/adminguide/images/chat-rtf-play-prompt-flow-1.png)


下圖顯示如何在[取得客戶輸入](get-customer-input.md)流程區塊中手動啟用提示，然後將流程區塊與 Amazon Lex 機器人建立關聯：

![\[此圖顯示一個流程區塊、一個提示與 2 個連結，一個用於常見問答集，另一個用於電話號碼。\]](http://docs.aws.amazon.com/zh_tw/connect/latest/adminguide/images/chat-rtf-get-customer-flow.png)


下圖顯示以 SYSTEM\$1MESSAGE 和各種 BOT 訊息類型顯示提示的情形：

![\[此圖顯示 SYSTEM 和 BOT 訊息中的「檢閱我們的常見問答集」和「打電話給我們」連結。\]](http://docs.aws.amazon.com/zh_tw/connect/latest/adminguide/images/chat-rtf-sys-bot-messages.png)


下圖顯示如何在 Amazon Lex 機器人意圖中設定提示：

![\[此圖顯示 Amazon Lex 意圖，其中包含一個提示與 2 個連結，一個用於常見問答集，另一個用於電話號碼。\]](http://docs.aws.amazon.com/zh_tw/connect/latest/adminguide/images/chat-rtf-lex-flow.png)


如需意圖的詳細資訊，請參閱《Amazon Lex V2 開發人員指南》**中的[新增意圖](https://docs.aws.amazon.com/lexv2/latest/dg/add-intents.html)。如需 Lambda 訊息的詳細資訊，請參閱《*Amazon Lex V2 開發人員指南*》中的[使用 AWS Lambda 函數啟用自訂邏輯](https://docs.aws.amazon.com/lexv2/latest/dg/lambda.html)。