HubSpot のフォームを埋め込み式で作成する
![HubSpotで埋め込みフォームを設定する方法](https://rocket-boys.co.jp/wp-content/uploads/2024/01/contact-2860030_640.jpg)
HubSpotは無料、有料問わずフォームを作成する機能があるので、今回はHubSPotでフォームを作成する方法を記載します。
なお、無料版の場合フォームに「HubSpotを利用しています」というロゴが表示されます。
※内容は2024年1月時点の情報になります。
目次
HubSpotのフォーム作成前に確認すべきこと
HubSPotは会社名や担当者姓 名、電話番号、住所などは既にデフォルトで設定されています。
しかし部署名や検討時期などの項目はデフォルトで存在しませんので、
1:フォームで設定する項目を確定
2:その項目がHubSpotに存在するか
を事前に調べることをおすすめします。
また、姓と名は別れているので、1つの氏名という項目に設定したい場合は、
姓か名の項目を氏名に変更することをおすすめします。
HubSPotの項目を調べる方法
ヘッダー右側の鍵のマークを選択
![](https://rocket-boys.co.jp/wp-content/uploads/2024/01/スクリーンショット-2024-01-10-9.52.41.png)
左のメニューからプロパティーを選択
![](https://rocket-boys.co.jp/wp-content/uploads/2024/01/スクリーンショット-2024-01-10-9.53.09.png)
プロパティーを検索で該当しそうな項目名を検索
![](https://rocket-boys.co.jp/wp-content/uploads/2024/01/スクリーンショット-2024-01-10-9.53.59-1024x329.png)
HubSpot のフォーム作成方法
ヘッダーからメニューを選択
ヘッダーのマーケティング→リード情報の収集→フォームを選択し、
右上のフォームを作成
![hubspot フォーム作成](https://rocket-boys.co.jp/wp-content/uploads/2024/01/hubspot-フォーム-1024x322.png)
フォームタイプの選択
埋め込み型は指定のページへ埋め込む方法で、スタンドアロンはフォームのURLをリンクする形です。
今回は埋め込み型を選択します。
![HubSpotフォームの選択](https://rocket-boys.co.jp/wp-content/uploads/2024/01/HubSpotフォームの選択-1024x507.png)
HubSpot フォーム作成画面へ遷移
フォームのテンプレートを選択
1からフォームの項目を選択する方法もありますが、今回はお問い合わせを選択し、開始を選択します。
![](https://rocket-boys.co.jp/wp-content/uploads/2024/01/スクリーンショット-2024-01-10-9.57.41-1024x457.png)
HubSpotフォームの項目を選択
お問い合わせはデフォルトで、Eメール 名、性、メッセージ(備考欄)は設定されています。
追加項目が必要なら左側から項目を検索し、ドロップアンドドラック。
存在しない項目は新規作成する必要があります。新規項目の作成方法はこの記事の最上部、HubSpotのフォーム作成前に確認すべきこと をご覧ください。
![HubSPotの項目選択画面](https://rocket-boys.co.jp/wp-content/uploads/2024/01/スクリーンショット-2024-01-10-10.01.31-1024x500.png)
HubSpotフォームの入力必須や項目名を変更する
各項目の入力必須や項目名を変更する場合は、その項目へマウスをHoverさせ編集ボタンを選択
左側のメニューでラベルを変更すると、項目名が変更されます。
![](https://rocket-boys.co.jp/wp-content/uploads/2024/01/スクリーンショット-2024-01-10-10.06.22-1024x463.png)
ヘルプテキストは項目名の下部に表示される項目で、フリーアドレスのご登録はご遠慮します。と記載しています。
またプレースホルダーは記入例で利用され、今回はtest@rocket-boys.co.jp と表示しています。
デフォルトで入力値が設定される、既定値も設定可能ですが今回は割愛します。
![](https://rocket-boys.co.jp/wp-content/uploads/2024/01/スクリーンショット-2024-01-10-10.10.13-1024x379.png)
HubSpotの項目位置を変更する
HubSpotの項目位置を変更するには項目をドロップアンドドラッグすれば可能です。
今回は姓を左側に設定しています。
フォームの項目設定が完了したら次はオプション設定を行います。
HubSpotのオプション設定を行う
オプション設定では、リダイレクト先の設定になります。
特にリスティング広告などでコンバージョンを計測する場合は、Thanksページを設定した方が分かりやすいので、あらかじめリダイレクト先のページを作成し、オプション設定でリダイレクト先を指定します。
※埋め込み式の場合デフォルトではフォームが送信されてもURLが変わらないため、コンバージョン計測がやり辛いです。
HubSpotで別ページへリダイレクトさせる
フォーム送信した後のアクションで別ページにリダイレクトを選択後、
外部リンクを追加を選択
![](https://rocket-boys.co.jp/wp-content/uploads/2024/01/スクリーンショット-2024-01-10-10.22.23-1024x531.png)
リダイレクト先のURLへ任意の値を記載
![hubspotフォームのオプション選択](https://rocket-boys.co.jp/wp-content/uploads/2024/01/hubspotフォームのオプション選択-1024x497.png)
次にフォームのエラーメッセージの内容が英語になっているので、以下を日本語へ変更します。
![](https://rocket-boys.co.jp/wp-content/uploads/2024/01/スクリーンショット-2024-01-10-10.24.50-1024x468.png)
HubSpot フォームの公開
HubSpotのフォームの右上の更新を選択し、公開を選択
※埋め込み式なので、タグを設定しないと公開されません。
![](https://rocket-boys.co.jp/wp-content/uploads/2024/01/スクリーンショット-2024-01-10-10.26.16-1024x704.png)
以下タグを指定のサイトへ設定
![](https://rocket-boys.co.jp/wp-content/uploads/2024/01/スクリーンショット-2024-01-10-10.33.50-953x1024.png)
HubSpotでサンキューメールを設定する
HubSpotで自動のサンキューメールを設定することが可能です。設定方法は以下記事をご覧ください。
その他設定で意識すべき内容など