翻訳は機械翻訳により提供されています。提供された翻訳内容と英語版の間で齟齬、不一致または矛盾がある場合、英語版が優先します。

# HTML と JSX を使用して Amazon Connect エージェントワークスペースのビューをカスタマイズする
<a name="customize-views-jsx-sg"></a>

View リソースのレイアウトのルックアンドフィールをカスタマイズできます。これを行うには、[ビューを表示](show-view-block.md) ブロックに入力パラメータを渡す際に HTML または JSX を使用します。

[ビューを表示](show-view-block.md) ブロックで HTML または JSX を使用する簡単な例については、次のステップを実行します。

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?"
   }
   ```