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

キャンペーンモジュールは、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. [ フォームのタイミング] を選択します。フォームのタイミングで、リードフォームがいつ表示されるかが決まります。

   

7. フォームのタイプを[カスタムリードフォーム]に設定します。
8. フォームの埋め込みコードを貼り付けます。
9. （オプション）に貼り付けます確認HTML。確認画面が 5 秒間表示され、ビデオの再生が再開されます。確認HTMLが含まれない場合は、フォームの送信後に動画の再生が再開されます。

   

10. （オプション） [ フォームのプレビュー] をクリックして、フォームのプレビューを開きます。
11. [ 保存 ] をクリックして、リードフォームを保存します。

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

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

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

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

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

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

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

   

4. 行にマウスを合わせると、提出物を見るフォームデータを表示します。