

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

# 使用 HTML 和 JSX，來自訂 Amazon Connect 客服人員工作區的檢視
<a name="customize-views-jsx-sg"></a>

您可以自訂視圖資源配置的外觀和體驗。當您將輸入參數傳遞給 [顯示檢視](show-view-block.md) 區塊時，您可以利用 HTML 或 JSX 來執行此操作。

請完成下列步驟，以取得簡單範例，了解如何搭配使用 HTML 或 JSX 和 [顯示檢視](show-view-block.md) 區塊。

1. 透過 [顯示檢視](show-view-block.md) 區塊建立流程。

1. 開啟 [顯示檢視](show-view-block.md) 區塊的屬性頁面。

1. 在**檢視**下，從下拉式清單中選取**詳細資訊**。

1.  在**章節**區段中，選擇**設定 JSON**。

1. 複製貼上以下 JSON 程式碼。此程式碼會顯示 HTML 或 JSX 表達式的處理方式。

   **HTML 範例**

   ```
   {
   "TemplateString": 
        "<TextContent>Steps:<ol><li>Customer provides incident information</li><li>Customer provides receipts and agrees with 
            amount</li> <li>Customer receives reimbursement</li></ol></TextContent>"
   }
   ```

   **JSX 範例**

   ```
   {
   "TemplateString":
   "Please provide an introduction to the customers. Ask them how their day is going
   Things to say:
   Hello, how are you today? My name is Bob, who am I speaking to?"
   }
   ```