プレチャットフォームを使用すると、チャット開始前に名前、メールアドレス、部門の希望などの訪問者情報を収集できます。また、カスタムフィールドを追加して、識別やリード評価に必要な追加情報を収集することも可能です。これにより、エージェントは事前準備ができ、チャットを適切な部門へ自動的に振り分けることができます。

変更を保存する前に、Preview and test（プレビューとテスト）オプションを使用して、プレチャットフォームの見た目や動作を確認できます。これにより、すでにウェブサイト上で稼働しているチャットボタンに影響を与えることなく、デザイン、フィールド、コンテンツを調整できます。

プレチャットフォームへのアクセスと有効化方法

各プレチャットフォームは特定のチャットボタンに紐づいています。設定するには、Configuration（設定） > Chat（チャット） > Chat buttons（チャットボタン）に移動します。

編集したいチャットボタンを選択（または新規作成）し、Edit（編集）をクリックします。左側のメニューでOnline scenario（オンラインシナリオ）を選択します。Request information by pre-chat form, when chat button is clicked（チャットボタンがクリックされたときにプレチャットフォームで情報をリクエストする）というオプションを見つけ、チェックボックスをオンにして有効化します。このオプションの隣にあるEdit（編集）をクリックすると、プレチャットフォームの設定画面を直接開くこともできます。

プレチャットフォームはOffline scenario（オフラインシナリオ）でも有効化できますが、これはシナリオが「チャットボットを利用したオンラインボタンを表示する」に設定されている場合に限られます。

Pre-chat form（プレチャットフォーム）タブは、チャットボタンの左側メニューに常に表示されています。この機能が無効な場合、グレーアウトして表示されます。Online scenario（オンラインシナリオ）で有効化すると、このセクションがアクティブになり編集可能になります。

プレチャットフォームの編集

左側メニューからPre-chat form（プレチャットフォーム）セクションを開きます。ここでフォームの見た目を設定できます：

  • Logo（ロゴ） - フォームの上部に表示される画像をアップロードします。ロゴは、ヘッダー画像に対応した特定のプレチャットフォームスタイルでのみ表示されます。
  • Title（タイトル） - すべてのフィールドの上に表示されるフォームのメイン見出しを設定します。
  • Knowledgebase suggestions（ナレッジベースの提案） - 有効にすると、訪問者はプレチャットフォーム内で直接おすすめのナレッジベース記事を確認できるようになります。これによりSuggested articles（おすすめ記事）というオプションが追加され、チャットを開始する前に質問への回答となりそうな記事の一覧が表示されます。
  • Extend knowledge base search（ナレッジベース検索の拡張） - 任意で、記事本文だけでなく、記事のタイトル、キーワード、説明文も検索対象に含めることができます。これにより、訪問者の入力内容に基づいたより正確な提案が可能になります。
  • Description（説明文） - タイトルの下に表示される任意のテキストです。この説明文はHTML書式に対応しており、スタイル付きテキストやリンク、追加の案内などを挿入できます。

フォームデザインのカスタマイズ

Design（デザイン）サブタブでは、フォームの位置、スタイル、外観を制御できます：

  • Position（位置） - プレチャットフォームをページのどこに表示するかを選択します。選択したスタイルによって、フォームをページ中央に埋め込んだり、下部のいずれかの隅に表示したり、左右の端に固定したり、ポップアップウィンドウで開いたりすることができます。
  • Size（サイズ） - フォームの幅と高さを設定します。フォームが中央配置、コーナー配置、またはポップアップウィンドウとして表示されている場合は、手動でサイズ調整が可能です。それ以外の場合、フォームはあらかじめ定義された寸法を使用します。
  • Page blocker（ページブロッカー） - 有効にすると、フォームが開いている間、ウェブサイトの他のコンテンツが視覚的にブロック（オーバーレイ）されます。これにより訪問者の視線を誘導し、背景ページとの操作を防ぎます。
  • Z-index（Zインデックス） - ウェブサイト上の他の要素に対するフォームの重なり順序を定義します。値を高く設定するほど、プレチャットフォームが他のコンポーネントより上に表示され、重なりの問題を防げます。
  • Style（スタイル） - いくつかの定義済みビジュアルテーマから選択します。選択したスタイルによってフォーム全体のデザインが決まり、下部で利用できるカスタマイズオプション（色、枠線など）も変わります。
  • Color customization（配色のカスタマイズ） - 選択したスタイルに応じて、フォームの背景、テキスト、その他の配色要素を調整できる追加オプションが表示されます。利用可能な設定はスタイルによって異なります。
  • Custom CSS（カスタムCSS） - 独自のCSSルールを適用してフォームの外観を細かく調整できます。Set custom CSS（カスタムCSSを設定）をクリックすると専用のエディターが開きます。カスタムCSSはプレチャットフォームのスタイルごとに個別に保存されます。

フォームフィールドの管理

Fields（フィールド）サブタブでフォームの入力項目を管理できます。以下のことが可能です：

  • Name（名前）、Email（メールアドレス）、Message（メッセージ）などのフィールドを追加・削除する。
  • フィールドの順序を変更し、ラベルやプレースホルダーを編集する。
  • フィールドを必須または任意として設定する。
  • Let visitor choose department（訪問者に部門を選択させる）オプションを有効にして、選択された部門へチャットを自動的に振り分ける。