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

# 在 Amazon Connect 聊天中部署逐步指南
<a name="step-by-step-guides-chat"></a>

您可以在 Amazon Connect 聊天中啟用逐步指南，以建立互動式的自助體驗。這項功能會收集內容並將其傳給客服人員，協助您更快速地解決客戶問題。您可以給客戶您為客服人員建置的指南，擁有更優質的組態管理。

## 在 Amazon Connect 聊天中啟用逐步指南
<a name="step-by-step-guides-chat-enable"></a>

1. 請確認您已啟用並設定客服人員[逐步指南](step-by-step-guided-experiences.md)。設定指南後，請確認在保留聯絡等待客服人員接聽時，系統會彈出指南。

1. 設定流程，透過顯示視圖區塊在聊天流程中調用視圖，其設定方式與為客服人員設定此項目的方式相同。下列範例會在客戶選擇聊天泡泡時觸發指南。在將聊天轉移到客服人員之前，該流程會經過兩個視圖。  
![\[設定您的流程，以使用顯示視圖區塊，在聊天流程中調用視圖。\]](http://docs.aws.amazon.com/zh_tw/connect/latest/adminguide/images/step-by-step-guides-chat-enable-1.png)

1. 從管理員頁面建立託管聊天小工具。將聊天流程設定為您建立的流程。  
![\[從管理員頁面建立託管聊天小工具。將聊天流程設定為您建立的流程。\]](http://docs.aws.amazon.com/zh_tw/connect/latest/adminguide/images/step-by-step-guides-chat-enable-2.png)

   此託管聊天會產生類似以下的指令碼：

   ```
   <script type="text/javascript">
     (function(w, d, x, id){
       s=d.createElement('script');
       s.src='https://d38ij7tdo5kvz7.cloudfront.net/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', '0b68a091-3538-4dcd-888e-f3b3ae64c5aa');
     amazon_connect('styles', { iconType: 'CHAT', openChat: { color: '#ffffff', backgroundColor: '#123456' }, closeChat: { color: '#ffffff', backgroundColor: '#123456'} });
     amazon_connect('snippetId', 'QVFJREFIZ3R0VzRTQkxzUnR6S1BPcXRseVBOUVlvWVlFclZwZmJ5bWZUc1hHVU1SM0FHM3BsdU4yaTZVTW9jeTRqQTRWMDJZQUFBQWJqQnNCZ2txaGtpRzl3MEJCd2FnWHpCZEFnRUFNRmdHQ1NxR1NJYjNEUUVIQVRBZUJnbGdoa2dCWlFNRUFTNHdFUVFNRFB0SmlxckgzenRMTjJ4cUFnRVFnQ3RxUHVQZm1Zd1F2ZjZVTzJ2ZTk5am1aUWEwZW53SHFzcmQ5bkdzRVdrNHJIbkJGTk81ekRBK0o4L1Q6OnBwUTZuLzRRKzVvdWdiUHhJRUU2MGM0TDlhcXEyZ0tramVmNkp3N2YvNXBIMTRwdDJSWmFVcjdzVTNzaXorc1BHTHhSOGd0b285dWpiemFrTU1tbWZoY0VCUEY4S3Z1ckdXNnZtV0ZjcVNFYnhrZlpuMVpsb1FGQjZ1SW5LMi9laHlmQVhXY3JXS1NDL1oxd29UejVkSUYwOFBoT3QvUT0=');
     amazon_connect('supportedMessagingContentTypes', [ 'text/plain', 'text/markdown' ]);
   </script>
   ```

   最後一行包含允許的訊息陣列。您可以在其中新增互動式訊息，以在聊天中啟用指南。例如：

   ```
   amazon_connect('supportedMessagingContentTypes', ['text/plain', 'application/vnd.amazonaws.connect.message.interactive', 'application/vnd.amazonaws.connect.message.interactive.response']);                        
   ```

1. 將以下內容新增至允許 URL 清單，以允許逐步指南在聊天中運作：
   + `your-website-url/views/renderer/`

   如果您使用 CSP 在網站上運作聊天小工具，您應該已經有 Cloudfront URL。例如：
   + `https://unique-id.cloudfront.net/amazon-connect-chat-interface.js`

**注意**  
您也可以在聊天中使用指南與自訂建置通訊小工具。如需了解如何將逐步指南新增至自訂通訊小工具，請參閱 Github 上的 [Amazon Connect 聊天介面](https://github.com/amazon-connect/amazon-connect-chat-interface)。