ライブチャットウィジェットは、ウィジェットスクリプトでデータタグを使用してカスタマイズできます。 管理アプリからコピーするチャット ウィジェット スクリプト (Copilot Service admin center など) では、次のタグを使用できます。 詳細: Web サイトまたはポータルにチャット ウィジェットを埋め込む
| 属性名 | 説明 | 例 |
|---|---|---|
data-hide-chat-button |
チャットウィジェットを実装すると、デフォルトのチャットボタンを使用する代わりに、モバイルアプリのエクスペリエンスに合わせたチャットボタンを追加できます。 このような場合は、このデータタグを使用して、チャットウィジェットで使用できるデフォルトのオープンチャットボタンを非表示にします。 | <script id="Microsoft_Omnichannel_LCWidget" src="<valid-src>" data-app-id="<valid-app-id>" data-org-id="<valid-org-id>" data-org-url="<valid-org-url>" data-hide-chat-button="true"></script> |
data-hide-minimize-button |
チャットウィジェットを実装するときに、デフォルトのチャット内の最小化ボタンを無効にすることができます。 このデータタグを使用して、チャットウィジェットで使用できるデフォルトのチャット最小化ボタンを非表示にします。 | <script id="Microsoft_Omnichannel_LCWidget" src="<valid-src>" data-app-id="<valid-app-id>" data-org-id="<valid-org-id>" data-org-url="<valid-org-url>" data-hide-minimize-button="true"></script> |
data-disable-telemetry |
デフォルトでは、テレメトリ データ収集はすべてのウィジェットでオンになっています。 テレメトリ データ収集を無効にする場合は、このデータ タグの値を true に設定します。 詳細: ライブ チャット ウィジェットのテレメトリ |
<script id="Microsoft_Omnichannel_LCWidget" src="<valid-src>" data-app-id="<valid-app-id>" data-org-id="<valid-org-id>" data-org-url="<valid-org-url>" data-disable-telemetry="true"></script> |
data-render-mobile |
チャットウィジェットをモバイルモードで開きます。 チャットウィジェットは、モバイルデバイスで使用する場合、ヘッダーがありません。 詳細: モバイル アプリのライブ チャット ウィジェットのカスタマイズ | <script id="Microsoft_Omnichannel_LCWidget" src="<valid-src>" data-app-id="<valid-app-id>" data-org-id="<valid-org-id>" data-org-url="<valid-org-url>" data-render-mobile="true" ></script> |
data-color-override |
このデータタグを使用して、デフォルトのチャットウィジェットのテーマの色を上書きします。 このオーバーライドは、管理アプリのカラーテーマ設定よりも優先されます。 | 次に示すのは、ウィジェットのテーマの色が青に変更されている例です。<script id="Microsoft_Omnichannel_LCWidget" src="<valid-src>" data-app-id="<valid-app-id>" data-org-id="<valid-org-id>" data-org-url="<valid-org-url>" data-color-override="#0000FF"></script> |
data-font-family-override |
既定のフォント ファミリは Segoe UI です。 このデータタグを使用して、デフォルトのフォントファミリを別のネイティブサポートフォントで上書きします。 |
例 1: 既定の Segoe UI フォントをオーバーライドし、フォント ファミリを Arial に設定するには、次のようにします。 <script id="Microsoft_Omnichannel_LCWidget" src="<valid-src>" data-app-id="<valid-app-id>" data-org-id="<valid-org-id>" data-org-url="<valid-org-url>" data-font-family-override="Arial, Segoe UI"></script> 例2:Monotype Corsivaのようなカスタムフォントファミリーを追加するには: <script id="Microsoft_Omnichannel_LCWidget" src="<valid-src>" data-app-id="<valid-app-id>" data-org-id="<valid-org-id>" data-org-url="<valid-org-url>" data-font-family-override="Monotype Corsiva"></script> |
data-open-in-window |
このデータタグを使用して、チャットウィジェットを新しいウィンドウで開きます。 このタグは、 true または false (デフォルト値) に設定できます。 デフォルトでは、チャットウィジェットは同じブラウザウィンドウで開きます。
trueに設定すると、チャットウィジェットを選択すると新しいブラウザウィンドウで開きます。 |
<script id="Microsoft_Omnichannel_LCWidget" src="<valid-src>" data-app-id="<valid-app-id>" data-org-id="<valid-org-id>" data-org-url="<valid-org-url>" data-open-in-window="true"></script> |
data-suggested-action-layout |
このデータタグを使用して、推奨されるアクションを縦に表示します。 デフォルトでは、推奨されるアクションは水平方向に表示されます。 推奨されるアクションを縦に表示するには、このデータタグの値を stacked に設定します。 |
<script id="Microsoft_Omnichannel_LCWidget" src="<valid-src>" data-app-id="<valid-app-id>" data-org-id="<valid-org-id>" data-org-url="<valid-org-url>" data-suggested-action-layout="stacked"></script> |
data-enable-lcw-autofill |
このデータタグを使用して、チャットウィジェットが埋め込みモードでブラウザウィンドウを自動入力できるようにします。 | <script id="Microsoft_Omnichannel_LCWidget" src="<valid-src>" data-app-id="<valid-app-id>" data-org-id="<valid-org-id>" data-org-url="<valid-org-url>" data-enable-lcw-autofill="true"></script> |
data-custom-close-button-text |
このデータタグを使用して、チャットウィジェットの閉じるボタンをカスタマイズします。 入力は、デフォルトの「X」閉じるボタンの代わりに表示されるテキスト文字列です。 | <script id="Microsoft_Omnichannel_LCWidget" src="<valid-src>" data-app-id="<valid-app-id>" data-org-id="<valid-org-id>" data-org-url="<valid-org-url>" data-custom-close-button-text="End Chat"></script> |
data-enable-sso-magic-code |
このデータタグを使用すると、サインイン後にチャットで、またはクライアントを通じてサイレントにマジックコードをユーザーに自動的に送信できます。 この機能は多要素認証に似ており、フィッシング攻撃の防止に役立ちます。 このタグは、 true (デフォルト値) または false に設定できます。
falseに設定すると、サインイン後にコードがクライアントを介して自動的に送信されます。
trueに設定すると、サインイン後に手動でチャットに参加するためのマジックコードがユーザーに表示されます。 詳細については、この記事の 「ブラウザーの追加設定 」セクションを参照してください。 |
この例では、マジック コードは、ユーザー入力を必要とせずに、サインイン後にクライアントを自動的に渡します。 <script id="Microsoft_Omnichannel_LCWidget" src="<valid-src>" data-app-id="<valid-app-id>" data-org-id="<valid-org-id>" data-org-url="<valid-org-url>" data-enable-sso-magic-code="false"></script> |
ブラウザの追加設定
ここで概説されているブラウザ固有の手順を実行して、マジックコードを自動的に渡します。
Chromium ベースのブラウザ
- Microsoft Edge で、アドレス バーに「edge://flags/#third-party-storage-partitioning」と入力します。 Google Chromeで、アドレスバーに「chrome://flags/#third-party-storage-partitioning」と入力します。
- 表示されるページで、[ サードパーティ製ストレージのパーティション分割 ] フラグを [無効] に設定します。
Firefoxの
- Firefoxでは、アドレスバーに「about:preferences#privacy」と入力してください。
- 表示されるページで [カスタム] を選択し、[ Cookie] で [ クロスサイト追跡 Cookie] を選択します。
サファリ
設定ダイアログで [Feature Flags] を選択し、[ BroadcastChannel Origin Partitioning] の選択を解除します。
次のステップ
関連情報
積極的にチャットを開始する
ライブ チャット ウィジェットのテレメトリ
モバイル アプリ用にライブ チャット ウィジェットをカスタマイズする
ライブ チャット リファレンス