埋め込みフォームの設置

システム共通の設定

システム設定

埋め込みフォーム個別の設定に先立ち、システム設定で埋め込み先のドメイン等を指定しておく必要があります。 システム設定の編集権限を持つ管理者でログインし、[設定]→[システム設定]→[編集] へ進み、以下の項目を入力して設定を保存します。

リクエストを受け付ける外部ドメイン

フォームの埋め込み先となるドメインを設定します。 既に設定されているドメインがあるなど、複数のドメインを指定する場合は、セミコロン(;)区切りで複数指定します。

設定例
https://example.co.jp/;https://www.example.ne.jp
許可する外部ドメインのリクエストメソッド

「GET;POST」を選択します。

注意:

  • 許可するメソッドが「GET」だけでは埋め込みフォームからの登録が正しく動作しません。埋め込みフォームを利用する場合は、必ず「GET;POST」を指定ください。

  • 埋め込みフォームを利用するドメインと、それ以外に「リクエストを受け付ける外部ドメイン」に指定しているドメインとで、許可するメソッドを別々に設定することはできません。

reCAPTCHA を利用する場合のシステム設定

reCAPTCHA 機能を利用する場合は、追加で以下の項目も設定します。

reCAPTCHAの秘密鍵

Google の reCAPTCHA 機能から発行された Secret key を設定します。

reCAPTCHA 機能の詳細は、 reCAPTCHAユーザマニュアル を参照ください。

なお、埋め込みフォームで reCAPTCHA を利用する場合、 Google で設定するドメイン情報にはフォームの埋め込み先となるドメインを設定する必要があります。

リード項目の確認

埋め込みフォームに入力項目として表示するリードの属性は、基本項目設定にある項目から選択します。埋め込みフォームのために新しく項目を追加する場合は、予め全キャンペーン管理モードで追加項目を設定しておく必要があります。項目を追加すると、個別キャンペーンでリード項目を設定していても各キャンペーンに項目が追加されます。

[リード]→[基本項目設定] から、必要なリード項目が揃っていることを確認してください。

キャンペーンごとの設定

埋め込みフォームを設定するキャンペーンを作成し、[管理開始] して個別キャンペーン管理モードで以下の設定を行います。キャンペーンの申込種別は「キャンペーン」を、課金種別は「無料」を選択します。

リード基本項目の設定

[リード]→[基本項目設定] へ進み、個別キャンペーン用に基本項目を設定します。 「キャンペーン別の設定を行いますか?」に対して [はい] をクリックすると、対象キャンペーン用の設定を行うことができます。

項目を順に編集し、保存します。以下の設定は、対象のキャンペーンへの申込にのみ反映されます。

  • 埋め込みフォームで表示したい項目の「表示/非表示」を「表示」にします

  • 入力を必須にする場合は、「必須の可否」を「必須にする」にします

  • 入力値の形式チェックを行う場合は、エラー種別も設定します

  • 埋め込みフォームで表示する順番に項目の並び替えを行います

visitoritemsetting view.png
図 1. 基本項目設定画面例

埋め込みフォーム用のフローの割当

[キャンペーン]→[フロー] から、フローの一覧へ進みます。検索欄の「種別」から、 「キャンペーン埋め込みフォームテンプレート」を選択し、検索します。

flow list search embeddedflowtemplate.png
図 2. フロー一覧での埋め込みフォーム用フローテンプレートの検索

以下のいずれかの名前のフローについて、「割当」をクリックして対象のキャンペーンで埋め込みフォームが利用できるようにします。

  • キャンペーン申し込み([ユーザー情報]) …リード項目のみのフォームを作成する場合

  • キャンペーン申し込み([ユーザー情報/アンケート]) …リード項目に加えてアンケート項目も含むフォームを作成する場合

埋め込みフォームに必要な設定を登録します。

embeddedflow add.png
図 3. 埋め込みフォーム用フローの割当画面
項目 説明

名前

埋め込みフォームの名前を入力します。申込側には表示されません。1キャンペーン内で複数のフローを設定する場合は、それぞれの内容がわかる名前を設定することをおすすめします。

申込登録完了時の挙動

フォーム登録を完了したときの動作をさせるか、以下のいずれかを指定します。

  • 指定の完了メッセージを表示 …登録完了時に、ページ遷移せずにフォーム表示部分に完了メッセージを表示します。こちらを選んだ場合、「申込完了時に出力するメッセージ」に完了メッセージを入力します。完了メッセージには HTML タグを記載できます。

  • 指定のURLへリダイレクト …登録完了時に、任意のページに遷移(リダイレクト)するようにします。リダイレクト先のURLを「申込完了時に遷移するURL」に入力します。

reCAPTCHAの有効化

「無効」「有効」いずれかを選択します。有効にすると、埋め込みフォームに reCAPTCHA 画像が表示されるようになります。「reCAPTCHAのサイトキー」を合わせて設定します。

キャンペーンへの割当を登録すると、キャンペーン詳細画面のフロー一覧に埋め込みフォームが表示されます。ここから、フローの「詳細」リンクをクリックして詳細画面を表示します。(なお、アンケートを設定する場合は、ここの「アンケート」列の「登録」から、アンケートテンプレートを選択します)

seminar view flow minilist.png
図 4. キャンペーン詳細画面のフロー一覧

詳細画面に埋め込み用のタグが表示されます。このタグを任意のサイトの HTML ソースコード内に埋め込むことで、埋め込みフォームを表示することができます。

embeddedflow view example.png
図 5. 埋め込みフォーム用フローの詳細画面

埋め込み先サイトでのページ編集方法に沿って、フォームを表示したい箇所に埋め込みタグを設置してください。

フォーム表示の確認

埋め込み先のページで、実際にフォームが表示されていることを確認します。(フォームの見た目は、埋め込み先のページに適用されている CSS 等の内容によって異なります)

embeddedform example.png
図 6. 埋め込みフォームの出力例

必要項目を入力して「登録」ボタンをクリックすると、対象のキャンペーンにリードが登録されます。

フォームが表示されない、動作しない場合は

設定が不完全だったり、埋め込みフォームが利用可能な条件を満たしていなかったりすると、埋め込みフォームは表示されません。フォーム出力や登録でエラーが発生した場合、「開発コンソール」にエラーメッセージが表示されます。

トラブルシュート のセクションの内容や エラーケース の一覧を手がかりに、追加設定などを行ってください。

検索結果 ""

    検索結果がありません ""