更新日時 2025年11月4日
以下の 製品でご利用いただけます（別途記載されている場合を除きます）。
、
注: この記事は、 旧バージョンのエディター で構築された既存のフォームについてのみ参照用です。現時点では、更新されたフォームエディター を使用して作成したHubSpotフォームをWordPressページや投稿に埋め込む ことはできません 。更新されたフォームエディター を使用してフォームを作成および管理する方法について詳細をご確認ください。
WordPressでは、クラシックエディターまたはグーテンベルクエディターを使用してHubSpotの旧フォームを追加できます。
- WordPressサイトにフォームを埋め込む場合、フォームをレスポンシブにするには、 外部スタイルシート内に追加のCSS宣言を適用する 必要が生じることがあります。
- フォームがWordPressで機能していなかったり、公開中のページを表示すると埋め込みコードが変更されることに気付いた場合は、埋め込みコードが変更されないように 、プラグインを使用してフォームを挿入する必要があります。
- を参照して追加のトラブルシューティング手順をご検討ください。
- WordPressアカウントで、左のサイドバーメニューの［HubSpot］>［フォーム］に移動します。
- ウェブサイトに追加したいフォームの上にマウスポインターを置き、［埋め込み］をクリックします。［フォームを作成］をクリックして、新しいHubSpotフォームを作成することもできます。
- ［WordPressショートコード］をクリックしてから［コピー］をクリックして、エンベッドコードをコピーします。
- WordPressのページまたは投稿に移動し、ショートコードをページエディターに貼り付け ます。
ページを公開した後、WordPressでフォームへの送信を表示するには、次の手順に従います。 - WordPressアカウントで、左のサイドバーメニューの［HubSpot］>［フォーム］に移動します。
- フォームにマウスポインターを合わせる。次に、[アクション]ドロップダウンメニューをクリックし、[ 送信を表示]を選択します。フォーム送信の分析の詳細をご覧ください。
Gutenbergエディター
インラインJavaScriptが削除される最新バージョンのGutenbergを使用している場合は、 Inline JS Block for Gutenbergプラグイン を使用して、代わりにHubSpotの旧フォームとCTAをページに埋め込みます。
グーテンベルクエディターを使用してWordPressのページや記事にHubSpotの旧フォームを埋め込むには、次のようにします。
- WordPressアカウントで、ページまたは投稿に移動します。
- ツールバーのプラスアイコンをクリックします。HubSpotフォームのブロックを探し、クリックしてコンテンツに追加します。
- ブロックでは、既存のフォームを選択するか、新しいフォームを作成できます：
-
- 既存のフォームを選択するには、［既存のフォームを選択］ドロップダウンメニューをクリックし、フォームを1つ選択します。
- 新しいフォームを作成するには、左側のサイドバーメニューで［HubSpot］＞［フォーム］の順に進み、［フォームを作成］をクリックします。
- WordPressアカウントで、左のサイドバーメニューの［HubSpot］>［フォーム］に移動します。
- フォームにマウスポインターを合わせる。次に、[アクション]ドロップダウンメニューをクリックし、[ 送信を表示]を選択します。フォーム送信の分析の詳細をご覧ください。
