静的選択肢またはダイナミック選択肢コントロールにヘッダーカードを挿入する

仮想エージェント トピックを作成するときは、静的選択肢とダイナミック選択肢のユーザー入力コントロールに画像と YouTube ビデオを含めることができます。

始める前に

必要なロール：virtual_agent_admin または admin

手順

1. 移動先 すべて > 対話型インターフェース > 仮想エージェント > デザイナー をクリックし、トピックを開くか 、新しいトピックを作成します。
2. [フロー] タブで、静的選択肢またはダイナミック選択肢のユーザー入力コントロールをキャンバスにドラッグします。
3. プロパティシートで、[詳細 (オプション)] に移動し、[ヘッダーカード] セクションを展開します。
4. [挿入] 切り替えスイッチをスライドして有効にします。

   図 : 1. ヘッダーカードを挿入

   

5. [ Would you like help?] で、[ はい ] または [いいえ、スクリプトを使用します] を選択します。
   • [はい] を選択した場合は、[カードの追加] を選択し、次のフォームフィールドに入力します。

     表 : 1. [カードを追加] ダイアログボックス

     フィールド	説明
     カードタイプ	ヘッダーカードのタイプ： テキスト付きの大きな画像 テキスト付きの小さな画像 YouTube ビデオカード ダイアログボックス内のフィールドは選択した内容に応じて変わります。
     タイトル	画像またはビデオのタイトル。テキストフィールドに直接入力するか、データピルまたはスクリプトを使用して値を指定できます。
     タイトルリンク	ビデオタイトルのハイパーリンクに使用する URL。テキストフィールドに直接入力するか、データピルまたはスクリプトを使用して値を指定できます。このフィールドが空の場合、タイトルはプレーンテキストとして表示されます。 このフィールドは、YouTube ビデオカードオプションでのみ使用できます。
     説明	画像またはビデオの簡単な説明。
     画像 URL リンク	画像の URL リンク。テキストフィールドに直接入力するか、データピルまたはスクリプトを使用して値を指定できます。[ 画像をアップロード ] を選択して画像をアップロードすることもできます。 このフィールドは、大きいまたは小さい画像カードのオプションでのみ使用できます。
     画像の代替テキスト	画像を説明する、画面で読み取り可能な代替テキスト。アクセシビリティプログラムに使用されます。 このフィールドは、大きいまたは小さい画像カードのオプションでのみ使用できます。
     YouTube ビデオ ID	YouTube URL の末尾にある英数字の文字列。たとえば、URL「https://www.youtube.com/watch?v=AacDp2mUQ1I」の YouTube ビデオ ID は AacDp2mUQ1I です。 このフィールドは、YouTube ビデオカードオプションでのみ使用できます。

   • [いいえ、スクリプトを使用します] を選択した場合は、[スクリプトの追加] を選択して、スクリプト ダイアログ ボックスの例に従って、目的のメディアを表示するスクリプトを入力します。

     図 : 2. ヘッダーカードスクリプトの例

     function() {
         /*
             var cardName = "Large image with text";
             var cardData = {
                 title: 'Choose color',
                 description: 'choose the right color of the flowers in the image',
                 image: 'https://homepages.cae.wisc.edu/~ece533/images/tulips.png',
                 imageAlt: 'Choose color'
             }
             var template = "";
             if (vaSystem.isAMBClient(vaContext.deviceType))
                 template = vaSystem.fillTemplateFromData(cardName, JSON.stringify(cardData));
           return {
               cardTemplate: template,
               cardName: cardName,
               cardData: JSON.stringify(cardData),
               renderStyle: "card"
           };
         */
         }

6. [Save (保存)] を選択します。