How To

記事LPなどから遷移したときに、URLパラメータの値をセットした状態でチャットを起動したい

記事LPなど別のページのリンクにURLパラメータを付けると、遷移先のLPで、その値(選択した商品など)をフォームにセットした状態でecforce efoを起動できます。
別のページで選んだオファーを、遷移先のチャットに引き継ぎたい場合にご利用ください。

同じページ内のリンクから、項目を選択した状態で起動する方法は任意の項目を選択した状態でecforce efoを起動させたいをご確認ください。リンクに付ける「data-chat_」の属性はページをまたいで引き継げないため、別のページから引き継ぐ場合はこちらの記事の方法を使います。

リンクのURLの書き方

遷移先LPのURLに、次のパラメータを付けます。

パラメータ 内容
chat_[フォームキー]=[値] フォームにセットする値です。複数付けられます。
chat_scenario_key=[シナリオキー] チャットを起動するシナリオです。必要な場合だけ付けます(下記「シナリオを指定して起動する場合」参照)。

例えば、商品(フォームキー「product_variant」)に値「136524」をセットして起動する場合は、次のように書きます。

https://example.com/lp?u=xxx&chat_product_variant=136524

フォームキーと値は、プロファイルの編集画面で確認できます。確認方法は任意の項目を選択した状態でecforce efoを起動させたいの「フォームキーと値の確認方法」をご確認ください。値は、選択肢の「値」と完全に一致させてください。選択肢に無い値を指定した場合は、その値はセットされず、シナリオの指定も使わずに最初から起動します。同じフォームキーのフォームを複数置いている場合は、シナリオの並び順で最後にあるフォームの選択肢で判定します。公開前に、必ず実際のリンクから動作をご確認ください。

ご注意

URLの中の「?」は1つだけにしてください。2つ目以降のパラメータは「&」でつなぎます。
「lp?u=xxx?chat_product_variant=136524」のように「?」を2回書くと、ecforceが別のLPを表示してしまい、チャットが起動しません。

設定方法

遷移先LPに設置しているプロファイルに、次の設定を行います。

  1. プロファイル一覧で対象プロファイルの「編集」アイコンを押下して編集画面を開き、左上の「基本情報・全体設定」を押下します。
    「デザイン・動作設定」の「スクリプト」にある「ページ読み込み時イベント (複数)」を表示します。右上の「設定を検索」に「ページ読み込み時イベント」と入力すると、すぐに見つけられます。
    基本情報・全体設定のページ読み込み時イベント (複数)
  2. 「ページ読み込み時イベント (複数)」の「+」から「URLパラメータ > URLパラメータの値でフォームをセットしてチャットを起動する」を追加します。
    URLパラメータ > URLパラメータの値でフォームをセットしてチャットを起動する
  3. 追加した項目を押下して開くと、「パラメータ」で動きを調整できます。通常は変更せずにそのままお使いいただけます。
    パラメータ
  4. 画面右上の「保存」を押下して保存し、ビルドを実行してください。保存しただけでは、LPに設置しているチャットには反映されません。
パラメータ 内容
URLパラメータのプレフィックス 読み取るパラメータ名の先頭の文字列です(初期値: chat_)。変更した場合は、シナリオを指定するパラメータ名も「[プレフィックス]scenario_key」になります。
遅延時間 (ms) ページを開いてからチャットを起動するまでの待ち時間です(初期値: 500 = 0.5秒)。「自動起動」をONにしているプロファイルでは、「自動起動遅延時間 (ms)」のタイミングで起動するため、この値は使われません。
スクロール先のフォームキー 起動後、指定したフォームが表示された時点で、その位置まで自動でスクロールします(例: name1 で氏名の入力欄まで)。空欄の場合はスクロールしません。ページを開いてから15秒以内にそのフォームが表示されない場合も、スクロールしません。
起動時に1通ずつ再生(演出付き) ONにすると、シナリオを指定して起動したときに、回答済みのメッセージを通常と同じ間隔で1通ずつ表示します(下記「シナリオを指定して起動する場合」参照)。ページを再読み込みしたときは、通常どおりまとめて表示されます。

URLに「chat_」で始まるパラメータが付いていない通常のアクセスでは、この設定は何もしません。通常の起動方法(自動起動やボタンからの起動)はそのまま使えます。

シナリオを指定して起動する場合

「chat_scenario_key」を付けると、指定したシナリオから入力を始める状態でチャットが起動します。指定したシナリオより前のシナリオは「回答済み」として起動時にまとめて表示されます(非表示にはなりません)。

  • 「chat_scenario_key」には、値をセットしたフォームの次に回答してほしいシナリオのキーを指定します。シナリオキーとフォームキーを取り違えないようご注意ください。
  • 商品を選ぶと次へ進む構成など、シナリオが入力待ちで止まる場合に使います。入力待ちにならず自動で次へ流れる構成では、「chat_scenario_key」を付けずにフォームの値だけを渡すと、通常どおり1通ずつ表示される起動になります。
  • 回答済みのメッセージは一度に表示されます。通常と同じように1通ずつ表示したい場合は、パラメータ「起動時に1通ずつ再生(演出付き)」をONにしてください。
  • 起動したときに入力欄が画面の下に隠れて見える場合は、パラメータ「スクロール先のフォームキー」に入力してほしいフォームのキーを指定してください。
  • 回答済みとして扱われるシナリオの中に未入力の必須項目があると、起動時に入力エラーとして扱われ、その項目までスクロールします。指定したシナリオより前の必須項目は、すべてURLパラメータで値を渡してください。
  • 同じタブでページを開き直した(再読み込みした)場合は、URLの値をセットし直しません。お客様がチャットで選び直した内容や、進んだ位置はそのまま残ります。

ecforceのLPで商品を引き継ぐ場合

商品をURLパラメータでセットした場合は、あわせて「ページ読み込み時イベント (複数)」の「+」から「URLパラメータ > フォームの値をLPの入力要素に常時反映する」も追加してください。チャットで選択されている商品を、LPの注文フォームの商品欄に反映し続けます。
追加しない場合、チャット上の商品とLPの注文フォームの商品がずれて、確認画面の金額が合わないことがあります。

パラメータの初期値(フォームキー「product_variant」、CSSセレクタ「.product_select」)は、ecforceのLPの商品セレクトに合わせてあります。商品以外のフォームも反映したい場合は、フォームキーごとに追加してください。

チャットが起動しないときの確認ポイント

  • URLの「?」が1つだけになっているか(2つ目以降は「&」でつなぐ)
  • パラメータのフォームキーと値が、プロファイルの設定と完全に一致しているか
  • 「chat_scenario_key」にフォームキーではなくシナリオキーを指定しているか
  • 遷移先のページの <head> に、別のプロファイルの貼り付けコードの script タグが残っていないか(script タグは1ページに1つだけにしてください。1つのLPに複数のプロファイルを設置する場合も、script タグはメインとなるプロファイルのもの1つのみです。詳しくは1つのLPに複数のプロファイルを設置したいをご確認ください。URLパラメータで起動するプロファイルを切り替えることはできません)
  • シナリオを指定したのに最初から始まる場合は、「chat_scenario_key」の値がシナリオキーと一致しているか
  • 設定後にビルドを実行し、使用中のビルドに反映されているか

動作を確認するときは、ブラウザのシークレットウィンドウでURLを開いてください。通常のウィンドウでは、同じタブで以前に進めたチャットの状態(表示中のシナリオなど)が残り、動きが違って見えることがあります。

この記事の目次

このセクションの記事

How To