ポータルでの エージェントチャット の構成

  • リリースバージョン: Australia
  • 更新日 2026年03月12日
  • 所要時間：11分

    • エンドユーザーは、任意のポータルページで エージェントチャット の会話を開始して維持できます。ポータル固有のデータを エージェントチャット に渡すスクリプトを作成します。例: ナレッジベースの名前を 仮想エージェント の会話に渡します。

    始める前に

    必要なロール：admin
    • Glide 仮想エージェント (com.glide.cs.chatbot) または エージェントチャット (com.glide.interaction.awa) プラグインをアクティブ化します。Glide 仮想エージェント プラグインにはサブスクリプションが必要です。
      注:
      ポータルの仮想エージェントでNow Assistを使用する方法については、「Configuring assistants overview」を参照してください。

    手順

    1. 移動先 すべて > サービスポータル > エージェントチャット.
      サービスポータルエージェントチャット構成 [sp_agent_chat_config] テーブルが開きます。
    2. [新規] を選択します。
    3. フォームに入力します。
      フィールド 説明
      有効 構成がアクティブかどうか。
      名前 設定レコードの一意の名前。
      ポータル 指定されたチャット構成で使用するポータル。ポータルが選択されていない場合、構成はシステム内のすべてのポータルに適用されます。
      アプリケーション レコードの読み取り専用アプリケーションスコープ。
      公開

      ログイン前にユーザーが エージェントチャット を利用できるかどうか。
      ロール

      ユーザーが エージェントチャットを使用するために必要なロール。ロールを選択しない場合、 エージェントチャット はすべてのユーザーが使用できます。
      順序 構成を実行する順序を示す番号。適用される構成はポータルごとに 1 つだけです。ポータルに複数の構成が存在する場合、システムは最小から最大の順で最初に見つかった構成を実行します。
      サーバースクリプト

      ページとウィジェットデータを エージェントチャット 会話に渡すスクリプト。たとえば、フィールドを渡して、 エージェントチャット 値にアクセスできるようにします。このスクリプトで渡されたデータは、ポータルのすべてのページで使用できます。このスクリプトは GlideSPScriptable API にアクセスできます。

      注:
      ポータルのサフィックス、ページ ID、言語は、エージェントチャット で自動的に利用可能になり、カスタムスクリプトは不要です。URL に存在するシステム ID とテーブルは、自動的に エージェントチャット で利用可能になります。

      この例では、ポータルに関連付けられたカタログのリストを含むオブジェクトを返します。

      (function ($sp) {    
   return {        
      catalogs: $sp.getValue(‘catalogs’) 
   };
})($sp);

      iframe HTML 要素で エージェントチャット を開くと、カタログのリストが iframe URL に含まれます。このフィールドのパラメーターは、 エージェントチャット に渡された競合するページデータを上書きします。
    4. [送信] を選択します。

    タスクの結果

    ユーザーは、選択したポータルの任意のページから エージェントチャット 会話を開始および維持できます。

    エージェントチャットボタンのカスタマイズ

    ポータルの [ エージェントチャット ] ボタンで使用される色と画像を変更できます。

    始める前に

    [ エージェントチャット ] ボタンで使用されている画像の一方または両方を置き換える場合は、画像をインスタンスにアップロードします。画像のアップロードの詳細については、「 データベースへの画像の保存」を参照してください。

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

    このタスクについて

    [ エージェントチャット ] ボタンの次の要素を設定できます。
    • チャットウィンドウが開いていることを示す画像
    • チャットウィンドウが閉じていることを示す画像
    • ボタンの背景色

    これらの要素はポータルテーマで決定されます。エージェントチャットボタンをカスタマイズするには、ポータルテーマレコードの関連する SCSS 変数を更新します。詳細については、「 ボットのブランディングを設定する」を参照してください。

    注:
    システムプロパティ [sys_property] テーブル値 com.glide.cs.advanced-chat-popover が true に設定されているときに Web クライアントの仮想エージェントボタンアイコンを変更する場合は、Web クライアントの仮想エージェントチャットボタンを元のボタンアイコンと同じサイズに設定します。設定しないと、アイコンが特大に表示されます。

    手順

    1. 移動先 すべて > サービスポータル > テーマ.
    2. テーマレコードを開きます。
    3. [ CSS 変数 ] フィールドで、次の変数を追加します。
      変数 説明
      $sp-agent-chat-btn-close チャットウィンドウが閉じていることを示す画像。以下を含む画像 URL を使用します。
      • インスタンスアドレス
      • 参照するイメージ [db_image] レコードの名前
      たとえば、データベース内の tack-icon.png 画像を参照するには、次のように入力します。
      $sp-agent-chat-btn-close: url("https://<instance-name>.service-now.com/tack-icon.png");

      画像 URL は、[エージェントチャット] ボタンのtack-icon.pngを参照します

      デフォルト画像を使用するには、変数を削除します。
      $sp-agent-chat-btn-open チャットウィンドウが開いていることを示す画像。以下を含む画像 URL を使用します。
      • インスタンスアドレス
      • 参照するイメージ [db_image] レコードの名前
      たとえば、データベース内の book-icon.png 画像を参照するには、次のように入力します。
      $sp-agent-chat-btn-open: url("https://<instance-name>.service-now.com/book-icon.png");
      画像 URL は [エージェントチャット] ボタンのbook-icon.pngを参照します
      デフォルト画像を使用するには、変数を削除します。
      $sp-agent-chat-bg ボタンの背景色。16 進数コードを使用して色を設定します。たとえば、赤を使用するには、次のように入力します。
      $sp-agent-chat-bg: #ff0000;
      赤色の背景色
      デフォルトの背景色を使用するには、変数を削除します。
    4. [更新] をクリックします。

    仮想エージェント サービスポータル ウィジェットからの移行

    以前のリリースからアップグレードすると、ポータルの実装に 仮想エージェント サービスポータル ウィジェットが含まれる可能性があります。サービスポータル の構成でウィジェットのオプションを エージェントチャット に移行し、ウィジェットのすべてのインスタンスを削除すると、ユーザーが任意のポータルページで エージェントチャット の会話を開始して維持できます。

    始める前に

    必要なロール:(admin またはなし)

    手順

    1. 仮想エージェント サービスポータル ウィジェットのインスタンスオプションを記録し、インスタンスを削除します。
      1. 仮想エージェント サービスポータル ウィジェットの各インスタンスを見つけて、インスタンスオプションを開きます。
      2. 値を記録します。
      3. ウィジェットインスタンスを削除します。
    2. ウィジェットインスタンスに色インスタンスオプションが含まれている場合は、色変数をポータルテーマレコードに追加します。
      1. 移動先 サービスポータル > テーマ.
      2. ポータルのテーマレコードを開きます。
      3. [CSS 変数] フィールドに $sp-agent-chat-bg 変数を追加し、値を目的の色に設定します。 
        $sp-agent-chat-bg: #ff0000
    3. ウィジェットインスタンスオプションに URL パラメーターが含まれている場合は、それらを [サービスポータルエージェントチャット構成] フォームの サーバースクリプト フィールドに追加します。
      注:
      ポータルのサフィックス、ページ ID、言語は、エージェントチャット で自動的に利用可能になり、カスタムスクリプトは不要です。URL に存在するシステム ID とテーブルは、自動的に エージェントチャット で利用可能になります。
      1. 目的のポータルのサービスポータルエージェントチャット構成 [sp_agent_chat_config] テーブルのレコードに移動します。
      2. [ サーバースクリプト ] フィールドで、パラメーターを エージェントチャット に渡すカスタムスクリプトを作成します。

        この例では、chat_queueフィールドの値を現在の会話に返します。

        (function ($sp) {    
	return {        
		chat_queue: $sp.getValue('chat_queue')    
	};
})($sp);

    タスクの結果

    ウィジェットインスタンスは個々のポータルページから削除されます。代わりに、ポータルはすべてのポータルページにサービスポータルエージェントチャット構成レコードを適用します。

    ページデータの渡し先 エージェントチャット

    ウィジェットクライアントスクリプトで spContextManager クラスを使用して、動的ページデータを エージェントチャットに渡します。たとえば、ユーザーが サービスポータル ホームページから会話を開始したときに、承認ウィジェットの承認数をエージェントチャットに渡します。

    始める前に

    必要なロール：admin

    ウィジェットを調べて、ウィジェットクライアントスクリプトにデータがどのように渡されるかを理解します。データを エージェントチャットで使用できるようにするには、データを spContextManager サービスに渡す必要があります。その後、vaContext オブジェクトを使用して仮想エージェントトピックのデータにアクセスできます。仮想エージェントスクリプトでのコンテキスト変数の使用の詳細については、「仮想エージェントスクリプト」を参照してください。

    手順

    1. ウィジェットエディターでウィジェットを開きます。
    2. ウィジェットクライアントスクリプトを更新します。
      1. spContextManager サービスをウィジェットクライアントスクリプト関数に挿入します。
      2. spContextManager API を使用して変数をエージェントチャットに渡します。

      この例では、 approval_count を エージェントチャットに渡します。ユーザーが サービスポータル ホームページから会話を開始すると、エージェントチャット iframe URL に &sysparm_approval_count=5 が追加されます。

      function ($scope, spContextManager) {

   spContextManager.addContext('agent-chat', {
      'approval_count': 5       
   });
};

      この API に渡されるキーはページごとに一意です。たとえば、「 agent-chat」 キーがページ上の別のウィジェットによって addContext() メソッドによって既に初期化されている場合は、 updateContextForKey() メソッドを使用してキーのデータを更新する必要があります。 。spContextManager クラスの詳細については、「spContextManager」を参照してください。

    3. [Save (保存)] をクリックします。
    4. 仮想エージェントトピックでサービスポータルデータを使用します。
      1. 移動先 仮想エージェント > デザイナー をクリックし、 サービスポータル データを使用するトピックを開きます。
      2. [ トピックフローを編集] をクリックします。
      3. 必要に応じてトピックを構成します。
        スクリプトフィールドで、 vaContext オブジェクトを使用して、 サービスポータルから渡されたコンテキスト変数にアクセスします。

        仮想エージェントトピックの作成の詳細については、「仮想エージェントトピックの作成」を参照してください。

        たとえば、このスクリプトは、承認ウィジェットの approval_count 変数の値にアクセスします。 
        (function execute() {
    return "Your approval count is: " + vaContext.approval_count;
})()
      4. トピックを保存して公開します。

    タスクの結果

    エージェントチャット は、エンドユーザーが サービスポータル ページから会話を開始すると、変数にアクセスできます。

    エージェントチャットに変数の値が表示されます。

    ヘッダーメニューからライブチャットリンクを削除

    ポータルのヘッダーメニューにライブチャットリンクが含まれている場合は、ウィジェットのオプションスキーマを更新することで削除できます。

    始める前に

    必要なロール：admin

    このタスクについて

    ポータルレコードに [ チャットキュー ] フィールドを追加すると、ポータルのヘッダーメニューに [ライブチャット] リンクが追加されます。ポータルを エージェントチャット と統合すると、ライブチャットリンクは不要になります。

    手順

    1. サービスポータル設定ページで、 ポータルテーブル > メニュー付きインスタンス.
    2. ポータルのヘッダーメニューのレコードを開きます。
      たとえば、ベースシステムポータルを使用している場合は、 SP ヘッダーメニュー を開きます。
    3. [ その他のオプション] の [JSON 形式 ] フィールドで、次の JSON キーと値のペアを追加します。 
      “enable_live_chat”: {
    “displayValue”: “false”,
    “value”: false
}
      最終的な JSON は次のようになります。 
      {
    “enable_cart”: {
        “displayValue”: “true”,
        “value”: true
    },
     “enable_wishlist”: {
       “displayValue”: “true”,
         “value”: true
     },
    “enable_live_chat”: {
      “displayValue”: “false”,
        “value”: false
    }
}
    4. [更新] をクリックします。

    タスクの結果

    ポータルに移動しても、ヘッダーメニューに ライブチャット は表示されません。