コンソールに Web チャットをセットアップする

メモ

日本語で受講されている方へ
Challenge は日本語の Trailhead Playground で開始し、かっこ内の翻訳を参照しながら進めていってください。Challenge での評価は英語データを対象に行われるため、英語の値のみをコピーして貼り付けるようにしてください。日本語の組織で Challenge が不合格だった場合は、(1) この手順に従って [Locale (地域)] を [United States (米国)] に切り替え、(2) [Language (言語)] を [English (英語)] に切り替えてから、(3) [Check Challenge (Challenge を確認)] ボタンをクリックしてみることをお勧めします。

翻訳版 Trailhead を活用する方法の詳細は、自分の言語の Trailhead バッジを参照してください。

Trail Together の動画

エキスパートの説明を見ながらこのステップを進めて行きたい場合は、Trail Together シリーズの一部である、こちらの動画をご覧ください。

(巻き戻して最初から見直したい場合、このクリップは 25:08 分から開始されます。)

アクセシビリティ

この単元ではスクリーンリーダーのユーザー向けに指示が追加されている部分があります。この単元の詳細なスクリーンリーダー版を表示するには、以下のリンクをクリックしてください。

Trailhead スクリーンリーダー版を開く。

はじめに

Ursa Major Solar のカスタマーサービスをもう一段引き上げるために、Ada はそのチームが会社の Web サイトでお客様と直接チャットできるようにしたいと考えています。この要望を実現するために、ガイド付き設定フローを使用してチャットを設定します。チャットはお客様がカスタマーサポートチームに連絡するもう 1 つのチャネルで、すぐその場でお客様の質問に答えたり、問題を解決したりすることができます。

まずチャットキューを作成して、チャットエージェントを選択し、チャットを Web サイトに追加するための Snap-in コードスニペットを取得するという手順のすべてを 1 つの設定フローで行います。

歯車アイコン をクリックして、[Service Setup (サービスの設定)] を選択します。
[Recommended Setup (推奨設定)] で、[View All (すべて表示)] をクリックします。
[Chat with Customers (顧客とのチャット)] をクリックします。
[Start (開始)] をクリックします。
[Queue Name (キュー名)] に、Ursa Major Solar Chat (Ursa Major Solar チャット) と入力します。
[Name This Group (このグループに名前を付ける)] に、Chat Agent (チャットエージェント) と入力します。
ユーザーのリストの Ada Balewa とあなたの名前の横にあるチェックボックスをクリックして、[Next (次へ)] をクリックします。
[Prioritize chats with your other work (他の作業でのチャットの優先度付け)] というページが表示されたら、[Ursa Major Solar Chat (Ursa Major Solar チャット)] キューの横にある [Priority (優先度)] ボックスに 1 と入力して、[Next (次へ)] をクリックします。
[Work Item Size (作業項目サイズ)] 項目と [Agent Capacity (エージェント業務量)] 項目はデフォルトのままにします。
[Next (次へ)] をクリックします。
[Website URL (Web サイト URL)] に https://*.force.com と入力します。[Salesforce Site Domain (Salesforce サイトドメイン)] 項目に、your initials + today’s date (MMDDYY) (あなたのイニシャル + 今日の日付 (MMDDYY)) を入力します。
メモ: 別のプロジェクトですでにチャットを設定している場合は、このオプションが表示されず、次のステップに進むことができます。
[Salesforce Terms of Use (Salesforce 利用規約)] チェックボックスが表示されたら、[I have read and accept the Salesforce site Terms of Use (Salesforce サイト利用規約を読み同意しました)] チェックボックスをオンにして、[Next (次へ)] をクリックします。
表示されない場合は、[Next (次へ)] をクリックします。
[What's your type (種別は?)] 画面で、[Service (サービス)] を選択し、[Next (次へ)] をクリックします。
[Offline support (オフラインサポート)] をオンにして、ケースレコードと件名項目の横にある [Required (必須)] チェックボックスをオンにし、[Next (次へ)] をクリックします。
この [Chat Code Snippet (チャットのコードスニペット)] ボックスからコードをコピーせずに、[Next (次へ)] をクリックしてください。
[Done (完了)] をクリックします。

組み込みサービスのコードスニペットのコピー

[Service Setup (サービスの設定)] から、[Quick Find (クイック検索)] ボックスに Embedded Service Deployments (組み込みサービスリリース) と入力し、[Embedded Service Deployments (組み込みサービスリリース)] を選択します。
[Chat Agent (チャットエージェント)] の横にある下矢印をクリックして、[View (表示)] を選択します。
[Embedded Service Code Snippets (組み込みサービスのコードスニペット)] セクションで [Get Code (コードを取得)] をクリックします。
[Chat Code Snippet (チャットのコードスニペット)] セクションで、[Copy to Clipboard (クリップボードにコピー)] をクリックして、提供されたコードスニペットをコピーします。どこか安全な場所に貼り付けます。これは後で必要になります。
ヒント: コードスニペットをプレーンテキストエディターか HTML エディターに貼り付け、後で Visualforce ページに貼り付けるときにすべてが正しい形式のままであることを確認してください。
[Embedded Service Code Snippets (組み込みサービスのコードスニペット)] ウィンドウを閉じます。

オムニチャネルユーティリティの追加

オムニチャネルユーティリティを使用すると、Lightning コンソールのユーザーがオムニチャネル経由で転送される作業要求を受信できます。オムニチャネルユーティリティのすべてを設定したら、Ursa Major Solar サービスコンソールに追加して、Ada とそのチームがアクセスできるようにします。

[Service Setup (サービスの設定)] が開いていない場合は、歯車アイコン をクリックしてその設定を選択します。
[Quick Find (クイック検索)] ボックスに App Manager (アプリケーションマネージャー) と入力し、[App Manager (アプリケーションマネージャー)] を選択します。
Ursa Major Solar のサービスコンソールの横にあるドロップダウンをクリックして、[Edit (編集)] を選択します。
画面の左側にあるメニューから、[Utility Items (ユーティリティ項目)] をクリックします。
[Add Utility Item (ユーティリティ項目を追加)] ボタンをクリックして、[Omni-Channel (オムニチャネル)] を選択します。
[Save (保存)] をクリックして、をクリックします。
アプリケーションランチャー をクリックして、[Ursa Major Solar Service Console (Ursa Major Solar サービスコンソール)] を選択します。
コンソールの下部にあるユーティリティバーの [Omni-Channel (オムニチャネル)] をクリックします。
[Offline (オフライン)] の横にあるドロップダウンをクリックして、現在の状況として [Available - Chat (対応可能 - チャット)] を選択します。

[Available - Chat (対応可能 - チャット)] 状況が選択されたオムニチャネルユーティリティ

オムニスーパーバイザーを使用した内部情報の取得

歯車アイコン をクリックして、[Setup (設定)] を選択します。
[Quick Find (クイック検索)] ボックスに Supervisor (スーパーバイザー) と入力し、[Supervisor Settings (スーパーバイザー設定)] を選択します。
[Conversation Monitoring (会話の監視)] セクションにある、次の 4 つのオプションをすべて有効にします。

Conversation monitoring (会話の監視)
Agent sneak peek (エージェントプレビュー)
Customer sneak peek (顧客プレビュー)
Whisper messaging (示唆メッセージ)

[Save (保存)] を選択します。
アプリケーションランチャー をクリックして、[Ursa Major Solar Service Console (Ursa Major Solar サービスコンソール)] を選択します。
コンソールの上部のオブジェクト (取引先、ケースなど) の横にあるドロップダウンをクリックして、[Edit (編集)] をクリックします。
[Add More Items (アイテムをさらに追加)] をクリックします。
[Omni Supervisor (オムニスーパーバイザー)] の横にあるプラスをクリックして、[Add 1 Nav Item (1 個のナビゲーション項目を追加)] ボタンをクリックします。
[Save (保存)] をクリックします。
コンソールの [Navigation Items (ナビゲーション項目)] ドロップダウンから [Omni Supervisor (オムニスーパーバイザー)] を選択します。
オムニチャネルのサポート情報を表示するときにマネージャーが使用できるすべての機能が、[Agents (エージェント)]、[Queues Backlog (キューのバックログ)]、[Assigned Work (割り当てられた作業)] の 3 つのタブに分類されています。

[Agents (エージェント)]、[Queues Backlog (キューのバックログ)]、[Assigned Work (割り当てられた作業)] の情報を示すタブがある、マネージャー向けのオムニスーパーバイザー機能

テストの準備

お疲れさまでした。オムニチャネルに対応するようコンソールを設定しました。Ada の立場や顧客の立場でライブチャットセッションがどのようなものか試してみるという方法で、Web チャットをテストします。

注意: Web チャットをテストする場合は、Visualforce ページと Snap-in コードを使用します。実行する手順は、このプロジェクトのテストフェーズに固有のものであるため、実際の実装では異なることがあります。

歯車アイコン をクリックして、[Service Setup (サービスの設定)] を選択します。
[Quick Find (クイック検索)] ボックスに Visualforce と入力し、[Visualforce Pages (Visualforce ページ)] を選択します。
[New (新規)] をクリックします。
[Label (表示ラベル)] に Web Chat (Web チャット) と入力します。
[Name (名前)] に Web_Chat と入力します。
説明に Ursa Major Solar’s test website for using web chat (Web チャットを使用するための Ursa Major Solar のテスト用 Web サイト) と入力します

既存のコードを次のコードに置き換えます。

<apex:page>
 <h1>Let’s start chatting...</h1>
 <br />
 Click the button to start a chat.
 <br />
 [PASTE YOUR SNAP-INS CODE SNIPPET HERE]
</apex:page>

[PASTE YOUR SNAP-INS CODE SNIPPET HERE] を、以前に保存した Snap-in コードスニペットと置換します。スニペットの開始位置を覚えておきたい場合は、コードコメントをコードに残しておいて構いません。
[Save (保存)] をクリックします。

コードスニペットをどこかでなくしてしまっても、心配はいりません。Snap-in 設定で見つけることができます。[Quick Find (クイック検索)] ボックスに「Embedded Service」(組み込みサービス) と入力し、[Embedded Service (組み込みサービス)] を選択します。次に、リリースを表示して、[Get Code (コードを取得)] をクリックします。

Visualforce ページ URL の許可リストへの追加

Visualforce ページの URL を許可リストに追加しておくと、Web ブラウザーが独自のオリジン以外からもリソースにアクセスできます。こうすれば、お客様が簡単に Snap-in チャットにアクセスできるようになります。CORS を使用して、Ursa Major Solar のページにこの機能を設定します。

[Quick Find (クイック検索)] ボックスに CORS と入力し、[CORS] を選択します。
[New (新規)] ボタンをクリックします。
https://*.vf.force.com と入力します。
[Save (保存)] をクリックします。

テスト、テスト、テスト!

アプリケーションランチャー をクリックして、[Ursa Major Solar Service Console (Ursa Major Solar サービスコンソール)] を選択します。
歯車アイコン をクリックして、[Service Setup (Service 設定)] を選択すると、新しいブラウザータブが開きます。
[Quick Find (クイック検索)] ボックスに Visualforce と入力し、[Visualforce Pages (Visualforce ページ)] を選択します。
[Web Chat (Web チャット)] ページの横にあるをクリックして、新しいタブまたはウィンドウにチャットを開きます。
ページの下部にある Snap-in ボタン (チャットボタン) をクリックして、チャットを要求します。
[First Name (名)] 項目に Jack と入力します。
[Last Name (姓)] 項目に Rogers と入力します。
[Start Chatting (チャットを開始)] をクリックします。
Ursa Major Solar サービスコンソールを表示している別のタブ/ウィンドウに移動します。
オムニチャネルユーティリティで、チェックマークをクリックしてチャット要求を受け入れます。
チャットをやり取りしてテストします。
エージェントまたはお客様のチャットウィンドウからチャットを終了します。

お疲れさまでした。Ada Balewa とそのチームがケース管理の業務を最適化できるように、Ursa Major Solar のサービスコンソールを設定しました。Ursa Major Solar のサービスコンソールを作成してカスタマイズし、ユーティリティ項目を追加して、Ada とそのチームのアクセスを有効にしました。これでチームが、どのチャネルから届いたケースにも対応することができます。

ヘルプをお探しですか?

もっと探す