サポートに連絡する| システムステータス
ページコンテンツ

    HubSpotの用のカスタムリードフォームの作成

    このトピックでは、HubSpotフォームを使用してBrightcoveプレーヤー内のリードデータをキャプチャする方法を学習します。

    キャンペーンモジュールは、Brightcoveプレーヤー内でビデオが再生されるときに、視聴者情報をキャプチャできるカスタムリードフォームを作成する機能を提供します。リードデータは HubSpot に送信され、HubSpot によって処理されます。

    カスタム潜在顧客フォームを作成するには、次の手順を実行する必要があります。

    1. HubSpot でフォームを作成する
    2. フォームの埋め込みコードをコピーして編集する
    3. キャンペーンモジュールでカスタムリードフォームを作成します
    4. リードフォームをプレーヤーに割り当てる
    5. HubSpot でフォームデータを検証する

    HubSpot でフォームを作成する

    HubSpot フォームを使用して、Web サイトの訪問者からリード情報を生成できます。これらのフォームは、ブライトコーブプレーヤーの内部に表示することもできます。以下の手順では、閲覧者の情報をキャプチャする簡単なフォームを作成します。HubSpot フォームの詳細については、 HubSpot のドキュメントを参照してください

    1. HubSpot アカウントにサインインします。
    2. マーケティング > フォームをクリックします。クラシックメニューを使用している場合は、[ 連絡先] > [ フォーム] をクリックします
    3. [ フォームを作成] をクリックします
    4. クリック埋め込みフォーム次にクリックします。デフォルトでは、フォームにはEメールフィールドと送信ボタン。
    5. [ 空白のテンプレート]が選択されていることを確認します。[ 開始] をクリックします
    6. ヘッダーの既定の名前をクリックし、フォームの名前を指定します。Enterキーを押して、変更を保存します。
    7. ヘッダーの既定の名前をクリックし、フォームの名前を指定します。Enterキーを押して、変更を保存します。
    8. ページの左側には、フォームに追加できるフィールドのリストが含まれています。ドラッグアンドドロップファーストネーム苗字ページの右側にあるフォームに必要なフィールド。
    9. フィールドを必須にするには、そのフィールドにマウスポインターを置き、[ その他] > [必須にする] をクリックします。必須フィールドには、フィールドラベルの横に「*」が表示されます。
    10. ページの上部にある [ オプション]リンクをクリックします。
    11. [ 訪問者がこのフォームを送信した後にどうなるべきか]で、[ ありがとうメッセージを表示する] をクリックします。デフォルトのメッセージは表示されないので、そのままにします。
    12. ページの上部にある [ スタイルとプレビュー]リンクをクリックします。デフォルトでは、デスクトッププレビューが表示されます。
    13. クリック公開ページの上部にあるフォームへの変更を公開します。

    フォームの埋め込みコードのコピーと編集

    キャンペーンモジュール内でフォームを使用するには、フォーム埋め込みコードをコピーして編集する必要があります。また、フォームに基本的なスタイリングを行うこともできます。以下の手順では、フォーム埋め込みコードを HTML エディターにコピーし、フォームにいくつかのスタイル変更を行います。

    1. クリック共有ページの右上にある埋め込みコードをクリップボードにコピーします。
    2. 任意の HTML エディタに埋め込みコードを貼り付けます。
    3. 埋め込みコードを少し変更する必要があるため、キャンペーンはフォームが送信されたときにフォームを閉じることを認識します。 formId:行の末尾にカンマを追加している行を探します。
    4. formId:この行をラインの下に追加します。
      onFormSubmit: bcLeadForm.submit
    5. デフォルトでは、フォームが Brightcove Player 内に表示される場合、フォームはプレーヤーの上に透明な背景に表示されます。次のCSSを埋め込みコードに追加して、背景色を灰色に変更します。
      <style>
      body {
      background-color: rgba(204,204,204,0.9);
      margin: 0;
      padding: 20px;
      height: 100%;
      }
      </style>

    キャンペーンモジュールでカスタムリードフォームを作成する

    フォーム埋め込みコードを編集したら、キャンペーンモジュールでカスタムリードフォームを作成し、リードフォームをキャンペーン対応プレーヤーに関連付けます。

    1. キャンペーンモジュールを開きます。
    2. クリックリードフォーム左側のナビゲーションで。リードフォームが作成されている場合は、それらが表示されます。
    3. リードフォームの作成」をクリックします
    4. リードフォームにはわかりやすい名前を付けます
    5. フォームの言語を選択します
    6. [ フォームのタイミング] を選択します。フォームのタイミングで、リードフォームがいつ表示されるかが決まります。
      edit lead form (1)
    7. フォームのタイプを[カスタムリードフォーム]に設定します。
    8. フォームの埋め込みコードを貼り付けます
    9. (オプション)に貼り付けます確認HTML。確認画面が 5 秒間表示され、ビデオの再生が再開されます。確認HTMLが含まれない場合は、フォームの送信後に動画の再生が再開されます。
      edit lead form (2)
    10. (オプション) [ フォームのプレビュー] をクリックして、フォームのプレビューを開きます。
    11. [ 保存 ] をクリックして、リードフォームを保存します。

    プレイヤーにリードフォームを割り当てる

    リードフォームを作成したら、プレイヤーに割り当てる必要があります。リードフォームをプレーヤーに割り当てるには、次の手順を行います。

    1. クリックキャンペーンプレイヤー左側のナビゲーションで。
    2. プレイヤーを見つけ、[ リードフォーム]ドロップダウンリストを使用してリードフォームを選択します。

    これでセットアップは完了しました。リード情報を取得する準備ができました。キャンペーン対応プレーヤーを使用してビデオを公開すると、フォームのタイミング設定に従ってリードフォームが表示されます。

    HubSpot でフォームデータを検証する

    カスタムリードフォームを使用してキャプチャされたリードは、HubSpot アカウントの連絡先として追加されます。リードフォームによってキャプチャされたデータを表示する簡単な方法は、HubSpotでスマート・リストを作成することです。

    1. HubSpot アカウントにサインインします。
    2. クリックマーケティング > フォーム
    3. フォームの上にマウスを置くと、行動メニューが表示されます。[ アクション] > [提出物の表示] をクリックします。フォーム送信のリストが表示されます。
      assign-lead-form-to-player
    4. 行にマウスを合わせると、提出物を見るフォームデータを表示します。
      assign-lead-form-to-player

    ページの最終更新日26 Oct 2021