メインコンテンツにスキップ
お客さまへの大切なお知らせ:膨大なサポート情報を少しでも早くお客さまにお届けするため、本コンテンツの日本語版は人間の翻訳者を介さない自動翻訳で提供されております。正確な最新情報については本コンテンツの英語版をご覧ください。

ウェブチャットを作成する

更新日時 2024年 12月 19日

以下の 製品でご利用いただけます(別途記載されている場合を除きます)。

すべての製品とプラン

ウェブチャットによるチャットフローを構築して、担当者が訪問者と直接やり取りすることができます。ウェブチャットはウェブサイト上のページにウィジェットとして表示され、訪問者はウィジェットをクリックして貴社の担当者とリアルタイムのコミュニケーションを始めることができます。価格ページの訪問者を営業チームのメンバーに接続するウェブチャットや、ナレッジベースの記事の訪問者をサポートチームのメンバーに接続する別のウェブチャットを作成することができます。

注: CRMタブでチャットフローの権限を持つユーザーのみがチャットフローを作成および編集できます。

顧客対応エージェント または ルールベースのチャットボットの作成について詳細をご確認ください。

live-chat-example

Facebook Messengerアカウント用のウェブチャットを作成することもできます。Facebook Messenger 用チャットフローを作成する方法を学習 .

始める前に

ウェブチャットを作成する前に、チャットチャネルをコミュニケーション受信トレイまたはヘルプデスクに接続してください。チャットチャネルでは、チームの空き状況やウィジェットの外観をカスタマイズします。また、HubSpotでホスティングされていないウェブサイトにウェブチャットを追加する場合は、ウェブチャットを作成する前に、外部ページにトラッキングコードを追加する必要があります。トラッキングコードがインストールされていない場合、ウェブチャットは表示されません

  • HubSpotのアカウントにて、[自動化]>[チャットフロー]の順に進みます。
  • 右上の[チャットフローを作成]をクリックします。
  • [ウェブサイト]を選択します。
  • [ワークスペース]ページで、次の操作を行います。
    • ドロップダウンメニューをクリックして受信トレイまたはヘルプデスクを選択します。選択できるのはチャネルが接続されている受信トレイのみです。チャネルと受信トレイの接続について詳細をご確認ください。 
    • チャットフローの言語を英語から変更するには、左側の[言語を選択]ドロップダウンメニューをクリックし、別の言語を選択します。
    • [次へ]をクリックします。
  • チャットフロー ページで、 ウェブチャット を選択します。
  • [作成]をクリックします。

1. 作成 - 歓迎メッセージを作成する

ウェブチャットセットアップの[作成]タブにリダイレクトされます。ここでチャットウィジェットの動作をカスタマイズし、訪問者への挨拶メッセージを作成します。

注:単一ページのアプリにチャットウィジェットを埋め込むか、APIを使用してウェブチャットをカスタマイズする場合は、 HubSpotの開発者ドキュメントでHubSpot コミュニケーション APIの使い方の詳細を確認してください。

  • 訪問者が初めてチャットを開始したときに表示されるメッセージをカスタマイズするには、[歓迎メッセージ]をクリックしてセクションを展開し、[歓迎メッセージを作成]テキストボックスにテキストを入力します。歓迎メッセージの言語の変更についてはこちらをご覧ください .
  • ウェブチャットにナレッジベース検索バーを追加するには、ナレッジベース検索をクリックしてセクションを展開し、ナレッジベース検索を有効にするスイッチをオンに切り替えます。
  • 受信したコミュニケーションを特定のメンバーに割り振りするには、[コミュニケーションの自動割り当て]をクリックしてセクションを展開し、[コミュニケーションの自動割り当て]スイッチをクリックしてオンに切り替えます。ドロップダウンメニューを使用して、コミュニケーションの割り当て先となるユーザーまたはチームを選択します。コミュニケーションの受信トレイまたはヘルプデスクでの割り振りルールの設定についてはこちらをご覧ください。

注: Sales HubまたはService Hub有料シートが割り当てられているユーザーを割り振りルールに含めることができます。

  • Eメールアドレスを提供するように訪問者に求めるタイミングを指定するには、[Eメールキャプチャー]をクリックしてセクションを展開します。[訪問者をEメールアドレスに依頼する]ドロップダウンメニューをクリックし、オプションを選択して、訪問者のEメールアドレスを尋ねるときに表示されるメッセージを入力します。コミュニケーションの受信トレイでコンタクトを作成するの詳細はこちら

overview-of-build-tab

  • 続行するには、画面下の[保存]をクリックして、[対象]タブをクリックします。

2. 対象 - ウェブチャットの表示位置を決定する

[対象]タブで、ウェブ チャット ウィジェットがウェブサイトページに表示される位置を指定できます。ウェブチャットウィジェットは、訪問者が特定のページURLにアクセスした時点で、または訪問者に関する確認済みの情報に基づいて表示することができます。ターゲティングオプションを組み合わせることで、サイトへの訪問者に合わせてパーソナライズすることもできます。チャットフローで使用できるその他のターゲティングオプションとターゲティングルールについてはこちらをご覧ください。

  • 訪問者が特定のウェブサイトURLにいるときに[ウェブサイトURL]セクションにウェブチャットウィジェットを表示するには、次のようにします。
    1. 最初のドロップダウンメニューをクリックし、[ウェブサイトURL]を選択します。
    2. 2つ目のドロップダウンメニューをクリックし、ターゲティングルールを選択する。
    3. テキストフィールドにルールの条件を入力します。website-url-targeting
  • 訪問者がURLに特定のクエリーパラメーターを含むウェブサイトページにいるときに、ウェブチャットウィジェットを表示する:
    1. 最初のドロップダウンメニューをクリックし、[クエリーパラメーター]を選択します。
    2. 1つ目のテキストフィールドに、クエリーパラメーター名を入力します。
    3. 2つ目のテキストフィールドに、クエリーパラメーターの値を入力します。query-parameter-targeting
  • 別のルールを追加するには、[ルールを追加]をクリックします。
  • 特定のページ(プライバシーポリシーのページなど)をウェブ チャット ウィジェットの対象から除外するには、[除外ルールを追加]をクリックします。

特定のコンタクトについて、確認済みの情報に基づいてウェブチャットの対象にすることもできます。訪問者の情報および行動セクションで、訪問者情報に基づいて基準を設定する:

  • 最初のドロップダウンメニューをクリックし、フィルターを選択します。既知の特定のコンタクト、または不明な訪問者を対象として絞り込むフィルターを使用することができます。
  • 2つ目のドロップダウンメニューをクリックし、条件を選択します。
  • 別のルールを追加するには、[ルールを追加]をクリックします。
  • 特定のページ(プライバシーポリシーのページなど)をポップアップフォームの対象から除外するには、[除外ルールを追加]をクリックします。
  • 別のフィルターグループを作成してターゲティングルールを追加するには、[フィルターグループを追加]をクリックします。target-based-on-visitor-behavior
  • 続行するには、画面下の[保存]をクリックしてから、[表示]タブをクリックします。
ターゲティングルールに複数のフィルターグループが設定されている場合は、
ターゲティングルール内でのAND/ORロジックの仕組みについて詳細をご確認ください。

3. 表示 - ウェブチャットの外観をカスタマイズする

[表示]タブで、チャット見出し、チャットウィジェットの動作、チャットウィジェットのトリガーなど、ウェブチャットの表示設定をカスタマイズします。ウェブチャットのアクセントカラーとページを編集するには、受信トレイ設定でチャットウィジェットの外観をカスタマイズする方法をご覧ください。

  • [チャットアバターを選択]セクションをクリックして展開し、[チャット見出し]ドロップダウンメニューをクリックして、チャットウィジェットに表示される名前とアバターを選択します。
    • カスタムブランディング:一般的なチーム名とイメージを表示します。
      • プラスアイコンaddをクリックして画像やGIFをアップロードし、表示する名前を入力します。
      • ユーザーの名前やアバターの代わりに、カスタムブランディングをチャットコミュニケーション全体に適用するには、[エージェントのエイリアスとしてコミュニケーション全体でカスタムブランディングを使用]チェックボックスをオンにします。カスタムブランディングは、チャットの文字起こしにも表示されます。

注:エージェントの別名としてコミュニケーションを通じてカスタムブランドを使用]チェックボックスをオンにした場合、ミーティングツールを介してチャットウィジェットに追加されたミーティングリンクは削除されます。

    • 特定のユーザーおよびチーム:表示する名前の横にあるチェックボックスをオンにします。3人以上のユーザーを選択した場合、ユーザーがランダムに表示されます。チャットフロー言語があなたの表示名にどのような影響を与えるかをご覧ください。
    • コンタクト担当者:チャットを開始した新規訪問者または未割り当ての訪問者に対しては、[コンタクト担当者がいない場合、次のメンバーに割り当てる]ドロップダウンメニューをクリックして、代替オプションを選択します。
persist-custom-branding-chat-widget
  • [チャット画面の動作]セクションで、デスクトップまたはモバイル画面でのウィジェットの動作を制御します。

注:訪問者がチャットフローを最小化することを選択した場合、hs-messages-hide-welcome-message Cookieの有効期限が24時間経過するまで、HubSpotはページとチャットフロー全体で訪問者の行動を尊重します。この動作はチャット表示動作の設定と競合する可能性があるため、チャットフローが想定通りにポップアップ表示されないことがあります。

    • [デスクトップ]タブで、使用する表示動作の横にあるラジオボタンを選択します。
      • 歓迎メッセージをポップアップで開く:チャットウィジェットの上に歓迎メッセージのプレビューを表示します。
      • チャット起動メニューのみを表示:チャット起動メニューのみを表示して、訪問者がクリックしたときにのみチャットウィンドウを開くようにします。
      • 歓迎メッセージを表示し、トリガー適合時にチャットウィジェットをポップアップで開く:歓迎メッセージのプレビューを表示してから、トリガーが満たされた時点、または訪問者がウィジェットをクリックした時点のいずれかが最初に発生したときに、チャットを開きます。
    • 選択されている表示動作によっては、チャットウィジェットをページに読み込むタイミングを指定することもできます。チャット表示トリガーの横にあるチェックボックスをオンにします。選択したトリガーはパソコン、タブレット、モバイルで適用されます。
      • 離脱の意思があるとき:訪問者のマウスがブラウザーウィンドウの上部に移動した時点でウェブ チャット ウィジェットをトリガーします。
      • ページでの滞在時間(秒):訪問者がページにアクセスしている間に指定された時間(秒単位)が経過した時点でウェブ チャット ウィジェットをトリガーします。

注:ページの読み込み時間を短縮するために、5秒以上の遅延を設定することをお勧めします。自分のサイトのページ読み込み時間についてもっと知る。

      • ページのスクロールの割合:訪問者がページ上の特定のポイントまでスクロールした時点でウェブ チャット ウィジェットをトリガーします。
    • [モバイル]タブで、使用する表示動作の横にあるラジオボタンを選択します。
      • 歓迎メッセージをポップアップで開く:チャットウィジェットの上に歓迎メッセージのプレビューを表示します。
      • チャット起動メニューのみを表示:チャット起動メニューのみを表示して、訪問者がクリックしたときにのみチャットウィンドウを開くようにします。

        チャット画面の動作

注:モバイルデバイスでチャットフローを無効にするには、ターゲティング設定に例外ルールを追加してください誰かがモバイルデバイスであなたのページを表示したときにチャットフローを非表示にします


  • 続行するには、下部の[保存]をクリックし、[オプション]タブをクリックします。

4. オプション

[オプション]タブで、ウェブチャットの言語設定をカスタマイズします。アカウントのデータプライバシー設定をオンにしている場合、ウェブチャットをカスタマイズして、ウェブサイトの訪問者にコミュニケーションへの同意を求める手順を含めることもできます。

  • ウェブチャットウィジェットのCookieの同意テキストを有効にするには、チャットのCookieを収集することに同意するスイッチをクリックして切り替えます。バナーに表示されるCookieテキストへの同意はカスタマイズできません
  • Cookieの同意テキストを有効にすると、同意バナーが表示されるタイミングを選択できるようになります。
    • 訪問者がチャットを開始する前に同意バナーを表示するには、[訪問者がチャットを開始する前に同意バナーを表示]ラジオボタンを選択します。
    • 訪問者がページを離れようとしているときにバナーを表示するには、[訪問者がページを離れそうなときに同意バナーを表示]ラジオボタンを選択します。

consent-to-cookies-banner-settings

注:訪問者の識別APIを通じて識別された訪問者には、チャットウィジェット内でCookieの収集に関する同意のデータプライバシー設定は表示されません。HubSpotはmessagesUtk Cookieを落とさないからです。アナリティクスCookieのバナーへの影響はありません。 訪問者の識別API について詳しくは、HubSpotの開発者ドキュメントをご覧ください。

  • 訪問者のデータ処理への同意を取得するには、データ処理への同意スイッチをクリックして切り替えてください。
    • [同意のタイプ]ドロップダウンメニューをクリックし、次のいずれかを選択します。
      • 明示的な同意が必要:訪問者がメッセージを送信するには、[同意する]をクリックする必要があります。
      • 正当な利害関係:訪問者がチャットを開始した時点で黙示的に同意したことになります。データ処理に関する同意のテキストは引き続き表示されますが、チャットを開始する際に[同意する]をクリックする必要はありません。updated-chat-widget
    • [処理同意テキスト]フィールドに、HubSpotの既定のテキストが表示されます。このテキストを編集して、訪問者に関する個人情報の保存および処理が必要な理由を説明することができます。同意テキストをカスタマイズした後、既定のテキストに戻す場合は、[HubSpot提供の文面にリセット]をクリックします。consent-to-process-default-text
  • 訪問者を配信カテゴリーにオプトインするには、訪問者があなたとチャットを始めたときに、通信の同意スイッチをクリックして切り替えてください。
    • 配信カテゴリードロップダウンメニューをクリックし、訪問者を加入させる配信カテゴリーを選択します。
    • [チェックボックスラベル]テキストフィールドを使用して、顧客が同意するコミュニケーションタイプについて説明します。chatflows-live-chat-consent-to-communicate

注:こうした機能はHubSpotに組み込まれていますが、状況に応じた最適なコンプライアンス上のアドバイスについては自社の法務部門にご相談ください。


marketing-contacts-for-chatflows

  • 顧客満足度アンケートをチャットウィジェット内から送信することができます。チャットコミュニケーションが終了すると、アンケートがチャットウィジェットに表示されます。収集されたアンケートの回答は、アンケートの詳細ページと、コミュニケーションの受信トレイまたはヘルプデスクのスレッドに表示されます。
    • [チャット訪問者からフィードバックを収集]セクションで、[既存のアンケートを接続]ドロップダウンメニューをクリックし、アンケートを選択します。

注:配信方法として[チャット]を選択している既存のアンケートにのみ接続できます。

collect-feedback-from-chat-visitors

    • ボットに接続する新しいアンケートを作成するには、[新規アンケートを作成をクリックします。配送方法は必ず[チャット]を選択してください。
  • [保存]をクリックします。

ウェブチャットの確認およびウェブサイトページへの追加

ウェブチャットのセットアップが完了したら、右上にある[プレビュー]をクリックして、ウェブチャットがどのようにウェブサイトに表示されるかを確認します。スイッチをクリックしてオンに切り替えると、これがウェブサイトページに追加されます。ウェブサイトの訪問者とチャットを始める準備ができている場合は、受信トレイで受信メッセージに応答する方法を学ぶまたはヘルプデスク

enable-chatflow

この記事はお役に立ちましたか?
こちらのフォームではドキュメントに関するご意見をご提供ください。HubSpotがご提供しているヘルプはこちらでご確認ください。