【ダイアログ】ツリー作成・編集手順
ダイアログのスタートアップガイドです。
こちらの記事は、ダイアログのツリー作成・編集手順についてご紹介しております。
画面構成などダイアログ機能の概要については、スタートアップガイド(概要編)をご確認ください。
- 1 前提
- 2 設定の流れ
- 3 ダイアログ画面でシナリオを設定する
- 3.1 各メッセージタイプの役割について
- 3.2 メッセージをまとめる
- 3.2.1 メッセージコンテナ
- 3.3 メッセージを発話して繋げる
- 3.3.1 リスト
- 3.3.2 チップ(値付き)
- 3.3.3 画像スライダー(アイテム)
- 3.4 メッセージを発話してコンテンツを表示する
- 3.4.1 テキスト
- 3.4.2 画像
- 3.4.3 イメージカード
- 3.4.4 YouTube
- 3.4.5 チップ(値なし)
- 3.4.6 マークダウン
- 3.4.7 画像スライダー(リンク)
- 3.4.8 画像スライダー(アタッチメント)
- 3.4.9 アタッチメント
- 3.4.10 スペシャルタグ
- 3.5 オペレータに繋げる
- 3.5.1 オペレータ接続
- 3.6 シナリオを新規作成する
- 3.6.1 シナリオ先頭メッセージの追加について
- 3.7 シナリオを編集する
- 3.7.1 メッセージの複製について
- 3.7.2 テスト方法について
- 4 チャットボタン設定画面でシナリオをボタンに紐づける
- 4.1 シナリオをボタンに紐づける
- 4.2 設定をインポートする
- 4.3 メッセージの削除・復元について
- 4.3.1 メッセージ削除の注意点について
- 4.3.2 メッセージを削除する方法
- 4.3.3 編集中に削除したメッセージを復元する場合
前提
ダイアログをご利用希望の場合は、弊社カスターマーサクセス担当者から概要及び設定方法についてご案内させていただきます。
ご利用をご希望の場合は、弊社カスターマーサクセス担当者にご連絡ください。
設定の流れ
ダイアログの設定の流れは大きく分けて以下です。
ダイアログ画面でシナリオを設定する
チャットボタン設定画面でチャットボタン設定とダイアログの紐付ける
以下から設定手順をご紹介します。
ダイアログ画面でシナリオを設定する
シナリオ設定手順の前に、各メッセージタイプの役割についてご紹介します。
メッセージタイプの役割は、大きく分けて4つに分類できます。
メッセージをまとめる
メッセージを発話して繋げる
メッセージを発話してコンテンツを表示する
オペレータに繋げる
役割ごとにメッセージタイプと設定項目を1つずつ紹介いたします。
メッセージコンテナ
複数メッセージタイプをまとめて投稿したい場合などにご利用いただくメッセージタイプで
メッセージコンテナの中に、複数メッセージを設定します。
メッセージコンテナの詳しい内容についてはこちらの記事をご覧ください。
| 設定項目名 | 設定項目の説明 | |
---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 |
| 必須 | 投稿メッセージ | 吹き出しとして投稿されるメッセージを入力してください。 |
| 必須 | 同時に投稿されるメッセージ | 同時に投稿されるメッセージを設定してください。(複数メッセージ追加可能) |
リスト
質問の選択肢リストを設定できます。ユーザーが選択した選択肢に応じて発話するメッセージを設定でき、次のメッセージに繋ぐことができます。
| 設定項目名 | 設定項目の説明 | ||
---|---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 | |
| 必須 | 投稿メッセージ | 吹き出しとして投稿されるメッセージを入力してください。 | |
| 必須 | 選 | リスト表示文 | リスト上に表示される文字を設定してください。 |
| 必須 | メッセージを追加(ボタン上の表記) | リスト表示文()をクリックした後に、投稿させるメッセージを設定してください。 |
チップ(値付き)
質問の選択肢チップを設定できます。ユーザーが選択したアイテムに応じて発話するメッセージを設定でき、次のメッセージに繋ぐことができます。
| 設定項目名 | 設定項目の説明 | ||
---|---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 | |
| 必須 | 投稿メッセージ | 吹き出しとして投稿されるメッセージを入力してください。 | |
| 必須 | チ | チップ表示文 | チップ上に表示される文字を設定してください。 |
| 必須 | メッセージを追加(ボタン上の表記) | チップ表示文()をクリックした後に、投稿させるメッセージを設定してください。 |
画像スライダー(アイテム)
複数の画像をスクロールして閲覧することのできる画像タイプのメッセージタイプを設定できます。
ユーザーが選択したアイテムに応じて発話するメッセージを設定でき、次のメッセージに繋ぐことができます。
| 設定項目名 | 設定項目の説明 | ||
---|---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 | |
| 必須 | 投稿メッセージ | 吹き出しとして投稿されるメッセージを入力してください。 | |
| 必須 | 画 | 画像上表示文 | 画像上に表示させるテキストを入力してください。 |
| 必須 | メッセージを追加(ボタン上の表記) | 画像上表示文()をクリックした後に、投稿させるメッセージを設定してください。 | |
| 必須 | 画像URL | 表示する画像のURLを入力してください。 | |
| 任意 | 代替テキスト | 画像が表示されない時に表示されるテキストを入力してください。 |
テキスト
ユーザーが選択したリストの選択肢に応じて、発話させるテキストメッセージを設定できます。
| 設定項目名 | 設定項目の説明 | |
---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 |
| 必須 | 投稿メッセージ | 吹き出しとして投稿されるメッセージを入力してください。 |
画像
ユーザーが選択したリストの選択肢に応じて、発話させる画像タイプのメッセージを設定できます。
| 設定項目名 | 設定項目の説明 | |
---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 |
| 任意 | 投稿メッセージ | 吹き出しとして投稿されるメッセージを入力してください。 |
| 必須 | 画像URL | 表示する画像のURLを入力してください。 |
| 任意 | 代替テキスト | 画像が表示されない時に表示されるテキストを入力してください。 |
イメージカード
ユーザーが選択したリストの選択肢に応じて、発話させる画像とテキストタイプのメッセージを設定できます。
画像、テキストにリンクボタンの設置ができます。
| 設定項目名 | 設定項目の説明 | |
---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 |
| 任意 | 投稿メッセージ | 吹き出しとして投稿されるメッセージを入力してください。 |
| 必須 | 画像URL | 表示する画像のURLを入力してください。 |
| 必須 | キャプション | 画像の下に表示されるテキストを入力してください。 |
| 必須 | 遷移先URL | リンクボタンをクリックした後に遷移するページのURLを入力してください。 |
| 必須 | リンクテキスト | リンクボタンに表示させるテキストを入力してください。 |
YouTube
ユーザーが選択したリストの選択肢に応じて、発話させるYouTubeタイプのメッセージを設定できます。
| 設定項目名 | 設定項目の説明 | |
---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 |
| 任意 | 投稿メッセージ | 吹き出しとして投稿されるメッセージを入力してください。 |
| 必須 | 動画ID | 表示させるYouTube動画の動画IDを入力してください。 |
| 任意 | オートプレイ | メッセージが表示後、自動で動画再生させたい場合はこちらの項目にチェックを入れてください。 |
| 任意 | 終了通知 | 動画再生終了時に、サーバーに終了通知を送る場合はこちらの項目にチェックを入れてください。 |
チップ(値なし)
ユーザーが選択したチップに応じて、ユーザー側の吹き出しとして発話させるメッセージを設定できます。
| 設定項目名 | 設定項目の説明 | ||
---|---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 | |
| 必須 | 投稿メッセージ | 吹き出しとして投稿されるメッセージを入力してください。 | |
| 必須 | チ | チップ表示文 | チップ上に表示される文字を設定してください。 |
マークダウン
ハイパーリンク表示ができます。(以下画像の「こちら」)
| 設定項目名 | 設定項目の説明 | |
---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 |
| 必須 | 投稿メッセージ | [リンクテキスト](URL)と入力することで、[]内に入力したリンクテキストを、指定したURLへリンクできるようになります。 ※上記サンプル画像を実現したい場合の記述例 おすすめ商品一覧は [こちら](https://solairo.co.jp) をご覧ください。 ▼その他マークダウン記法の記述例 ・電話番号 [リンクテキスト](tel:発信先の電話番号) ※記述例) ・メールアドレス [リンクテキスト](mailto:リンクしたいメールアドレス) ※記述例) |
吹き出し内で改行をしたい場合
以下のいずれかの方法で改行が可能です。
・1行空白の行を入れる
・文末に半角空白スペースを2つ入れる
※「\n」の使用はできません。
画像スライダー(リンク)
複数の画像をスクロールして閲覧することのできる画像タイプのメッセージタイプを設定できます。
ユーザーが選択したアイテムに応じて遷移させるページのURLを設定します。
| 設定項目名 | 設定項目の説明 | ||
---|---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 | |
| 必須 | 投稿メッセージ | 吹き出しとして投稿されるメッセージを入力してください。 | |
| 必須 | 画 | 画像上表示文 | 画像上に表示させるテキストを入力してください。 |
| 必須 | 遷移先URL | 画像クリック後に遷移するページのURLを入力してください。 | |
| 必須 | 画像URL | 表示する画像のURLを入力してください。 | |
| 任意 | 代替テキスト | 画像が表示されない時に表示されるテキストを入力してください。 |
画像スライダー(アタッチメント)
複数の画像をスクロールして閲覧することのできる画像タイプのメッセージタイプを設定できます。
ユーザーが選択したアイテムに応じて表示させるアタッチメント(アイテム一覧)を設定します。
| 設定項目名 | 設定項目の説明 | |
---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 |
| 任意 | 投稿メッセージ | 吹き出しとして投稿されるメッセージを入力してください。 |
| 必須 | 画像アイテム | スライダー上に表示させる画像アイテムを追加してください。 |
| 必須 | 画像上表示文 | 画像上及びスナックバー上に表示させるテキストを入力してください。 |
| 必須 | タグ | アタッチメント検索に使用する商品に紐づくタグを入力してください。 |
| 必須 | 画像URL | 表示する画像のURLを入力してください。 |
| 任意 | 代替テキスト | 画像が表示されない時に表示されるテキストを入力してください。 |
アタッチメント
アイテムの一覧をWebサイトの商品を連携し、アイテム一覧を表示することができます。
※特定のサービスをお申し込み頂いているお客様のみ利用できます。通常はご利用いただけませんのでご了承ください。
| 設定項目名 | 設定項目の説明 | |
---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 |
| 任意 | テキスト | スナックバー上に表示させるテキストを入力してください。 |
| 任意 | タグ | アタッチメント検索に使用する商品に紐づくタグを入力してください。 |
| 任意 | スナックバー省略 | スナックバーの表示を行わずにアタッチメントを起動させたい場合は、こちらの項目にチェックを入れてください。 |
スペシャルタグ
スペシャルタグで設定したアイテム一覧を表示することができます。
※スペシャルタグの設定方法についてはこちらの記事をご確認ください。
https://solairo.atlassian.net/wiki/spaces/WHAT1/pages/2521563137
| 設定項目名 | 設定項目の説明 | |
---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 |
| 任意 | テキスト | スナックバー上に表示させるテキストを入力してください。 |
| 任意 | タグ | スペシャルタグで設定したタグ名を入力してください。 |
| 任意 | スナックバー省略 | スナックバーの表示を行わずにアタッチメントを起動させたい場合は、こちらの項目にチェックを入れてください。 |
オペレータ接続
有人接客に切り替えることができます。
※BOTのみをご利用の場合は、こちらのメッセージタイプはご利用いただけません。
| 設定項目名 | 設定項目の説明 | |
---|---|---|---|
| 任意 | ラベル | こちらはチャット画面上には反映されない項目です。 |
まず、シナリオの新規作成方法をご案内します。
こちらで作成したシナリオは設定最後でダウンロードいただけます。
シナリオ先頭にチェックあり:「シナリオ先頭メッセージ追加」の場合
シナリオ先頭にチェックがある場合は、追加されたメッセージがシナリオのTOPに表示されます。
まずシナリオのTOPに表示させたいメッセージを追加したい場合は、「シナリオ先頭メッセージ追加」をクリックし、メッセージを設定してください。
「シナリオ先頭メッセージ追加」でメッセージを設定すると、タブ:ツリー上に設定したメッセージが表示されます。
シナリオ先頭にチェックなし:「新規メッセージ追加」の場合
一気にメッセージを追加し、後からツリー上のメッセージに紐づける場合は、「新規メッセージ追加」をクリックし、メッセージを設定してください。
※なお、デフォルトでチェックは入っておりませんが、メッセージ編集中にチェックを入れることも可能です。
ダイアログ画面のタブ:テスト環境をクリックします。
左上の「編集」ボタンをクリックします。
「シナリオ先頭メッセージ追加」ボタンをクリックします。
シナリオ先頭メッセージ追加後、ラベルを設定します。
※こちらは必須項目ではありませんが、チャットボタンと紐づける際にどのシナリオかを識別するために設定いただくことを推奨いたします。次にメッセージタイプを設定します。
シナリオ先頭メッセージの場合、複数のメッセージタイプをまとめることが可能な「メッセージコンテナ」を選択いただくことをおすすめいたします。
※メッセージコンテナの詳細はこちらをご覧ください。投稿メッセージは吹き出しに表示されるテキストメッセージです。
投稿メッセージは任意項目となります。次に同時に投稿するメッセージを設定します。
以下画像の赤枠内をクリック
ウィンドウの左上:「新規メッセージを追加して設定」ボタンをクリックします。
※すでに作成されたメッセージを選択することも可能です。「新規メッセージを追加して設定」ボタンをクリック後
メッセージが追加されるので、メッセージをクリックしメッセージを編集します。
こちらの見本設定では、メッセージタイプから「リスト」を選択します。
投稿メッセージは吹き出しに表示されるテキストメッセージです。
投稿メッセージは任意項目となります。
リストの選択肢を追加します。
「選択肢を追加」ボタンをクリックします。
選択肢上の表示文を設定します。
リスト表示文に任意のテキストを入力ください。
次にリストの選択肢をクリック後に投稿されるメッセージを設定します。
「メッセージを追加」ボタンをクリックします。「新規メッセージを追加して設定」をクリックします。
「確定」ボタンをクリックします。
※複数選択肢を追加する場合は「選択肢を追加」ボタンをクリックし、選択肢を追加ください。次にリストの選択肢をクリック後に投稿されるメッセージを設定します。
リスト表示文の右側に表示されているメッセージ(赤枠)をクリックします。
メッセージ設定に切り替わった後、ラベルを設定します。
※こちらは必須項目ではありませんが、チャットボタンと紐づける際にどのシナリオかを識別するために設定いただくことを推奨いたします。
次にメッセージタイプを設定します。
こちらの見本設定では、メッセージタイプから「画像スライダー(リンク)」を選択します。
投稿メッセージは吹き出しに表示されるテキストメッセージです。
投稿メッセージは任意項目となります。
画像スライダーに表示される画像アイテムを設定します。
「画像アイテムを追加」ボタンをクリックします。
画像アイテムの設定をします。
まず、画像上の表示文を設定します。
画像アイテムをクリックした後に、遷移するページのURLを設定します。
表示される画像を設定します。
「追加」ボタンをクリックします。
表示される画像のURLを設定し、「確定」ボタンをクリックします。
代替テキストを設定します。
画像が表示できない時に、画像の代わりに表示されるテキストです。
「確定」ボタンをクリックし、画像アイテムの追加が完了です。
※複数画像アイテムを追加する場合は「画像アイテムを追加」ボタンをクリックし、画像アイテムを追加ください。左側に表示されているリストをクリックし、リストの設定画面に戻ります。
リストの設定画面に戻った後、リストの選択肢をクリック後に投稿されるメッセージを設定します。
リスト表示文の右側に表示されているメッセージ(赤枠)をクリックします。
※リストの選択肢をクリック後に投稿されるメッセージの設定方法は、手順9と同じなので割愛します。設定が全て完了しましたら、「保存」ボタンをクリックします。
右下に「保存しました」が表示されましたら、テスト環境での設定保存が完了となります。
ここまで設定したシナリオの設定ファイルは以下からダウンロードいただけます。
こちらのファイルを元に内容をご編集いただき、ご活用ください。
※ファイルのインポート方法はこちらをご確認ください。
シナリオの編集方法についてご紹介します。
タブ:テスト環境の「編集」ボタンをクリックします。
タブ:ツリーを選択します。
「+」をクリックし、ツリーを展開します。
ツリー上から編集をするメッセージをクリックします。
画面下部のメッセージ編集画面でメッセージの編集または追加を行ってください。編集作業が完了したら「保存」ボタンをクリックします。
右下に「保存しました」が表示されましたら、テスト環境での設定保存が完了となります。
タブ:テスト環境で保存した設定を本番反映させたい場合は、「テスト環境を本番環境へ反映」ボタンをクリックしてください。
本番環境への反映確認ウィンドウが表示されましたら、右側「はい」ボタンをクリックします。
右下に「環境への反映が完了しました」が表示されましたら、本番環境への反映が完了となります。
一つのツリーごと複製したい場合
シナリオ先頭メッセージを選択し、メッセージ詳細の「このメッセージを複製する」をクリックします。
ツリーごと複製されます。
※シナリオ先頭メッセージのみ複製されますが、シナリオ先頭メッセージ配下のメッセージは複製されず元のメッセージを参照している状態となりますことご留意ください。
一つのメッセージを複製したい場合
複製したいメッセージをタブ:ツリーもしくはタブ:一覧から選択し、「このメッセージを複製」ボタンをクリックします。
タブ:一覧上に、複製したメッセージが追加されます。
チャット画面でのシナリオの動作確認方法は以下をご参照ください。
【ダイアログ】スタートアップガイド(概要編) | 設定したシナリオの動作確認に関してのTips
最後に、チャットボタン側の設定を行います。チャットボタン設定にシナリオを紐づけます。
チャットボタン設定画面を開き、保存済み一覧から使用するリビジョンを選択します。
「編集」ボタンをクリックします。
シナリオを紐づけるボタン設定の右側「∨」をクリックします。
初期化メッセージのプルダウンから「ダイアログ」を選択します。
ダイアログのプルダウンから紐づけたいシナリオを選択します。
「保存」ボタンをクリックします。
任意でコメントを編集する場合は、コメントを編集し、「確定」ボタンをクリックします。
右下に「保存しました」が表示されましたら、チャットボタン設定の保存が完了となります。次にダイアログを紐付けたチャットボタン設定をテスト環境に反映します。
該当のリビジョンをクリックします。
「テスト環境に反映」ボタンをクリックします。
任意でコメントを編集する場合は、コメントを編集し、「確定」ボタンをクリックします。
右下に「環境への反映が完了しました」が表示されましたら、テスト環境への反映が完了となります。最後にダイアログを紐付けたチャットボタン設定を本番環境に反映します。
※本番環境に反映前に、テスト環境で動作を確認したい場合はこちらをご確認ください。
「テスト環境を本番環境へ反映」ボタンをクリックします。
任意でコメントを編集する場合は、コメントを編集し、「確定」ボタンをクリックします。
右下に「環境への反映が完了しました」が表示されましたら、本番環境への反映が完了となります。
設定ファイルをインポートする手順をご紹介します。
ダイアログ画面のタブ:テスト環境をクリックします。
左上の「編集」ボタンをクリックします。
「設定をインポート」ボタンをクリックします。
インポートしたいファイルを以下画像の赤枠内をクリックしてファイルを選択していただく、もしくはファイルをドロップします。
ファイルが選択されましたた、「確定」ボタンをクリックします。
設定がインポートされましたら、「保存」ボタンをクリックします。
右下に「保存されました」が表示されましたら、設定ファイルのインポートが完了となります。
メッセージの削除と復元方法をご紹介します。
メッセージを削除する際の注意点をご確認の上、ご実施いただけますと幸いです。
シナリオは前後関係があるので、ツリーの一番最後のメッセージから削除を行ってください。
選択肢の追加などの必須項目未設定のメッセージを削除しようとすると、エラーが発生します。
※対処方法:選択肢の追加の必要ない、テキストメッセージに変更してから削除ください。
タブ:テスト環境の「編集」ボタンをクリックします。
タブ:ツリーを選択します。
ツリーの中からツリー上の一番最後のメッセージを選択します。
「このメッセージを削除」ボタンをクリックします。
メッセージ削除確認のウィンドウの内容が問題なければ、「はい」をクリックします。
削除したいメッセージを全て削除が完了したら、「保存」ボタンをクリックし、
エラーが表示されず、右下に「保存されました」が表示されましたらメッセージの削除と保存が完了です。
削除後「保存」した場合は、完全に削除されるのでその場合は復元できないことをご留意ください。
タブ:編集中のメッセージの中から「削除」ラベルがついているメッセージの「戻す」ボタンをクリック
確認のウィンドウの内容が問題なければ、「はい」をクリックします。
復元したいメッセージを全て復元が完了したら、「保存」ボタンをクリックします。
エラーが表示されず、右下に「保存されました」が表示されましたらメッセージの復元と保存が完了です。
記事の内容は以上となります。
設定に関して、ご不明点ございましたら、以下サポートサイト お問合せフォームより投稿をお願い致します。
https://solairo.atlassian.net/servicedesk/customer/portals