更新日時 2023年 1月 19日
以下の 製品でご利用いただけます（別途記載されている場合を除きます）。
すべての製品とプラン
|
HubSpot フォームを外部ページに埋め込むと、異なる場所に表示される場合があります。その原因として、フォームがページで動的に表示されることや、複数のフォーム埋め込みコードをページ HTML の同じ <div> タグに追加したことによる問題が考えられます。
フォームがページで動的に表示される
フォームがページで動的に表示され、異なる場所に読み込まれる場合があります。フォームがページの特定の場所に読み込まれるようにするには、フォーム埋め込みコードに target 属性を追加して、フォームを表示するコンテナを指定します。
フォーム埋め込みコードで、formId 属性値の後にコンマ (,) を追加し、新しい行を入力して「target: '[コンテナ名]'」と入力します。たとえば、sidebar の CSS クラスを使用してページのコンテナにフォームを表示するように強制することができます。
HubSpot の開発者ドキュメントでフォーム埋め込みコードのカスタマイズについて詳細を確認してください。
複数のフォーム埋め込みコードを同じ <div> タグに追加した場合
同じ HubSpot フォームを同じページで複数回埋め込むと、フォーム埋め込みコードがページ HTML 内の同じ <div> タグに追加されている場合、フォームが横並びで表示されたり間違った場所に表示されたりする場合があります。
フォームが正しく読み込まれて表示されるようにするには、formInstanceId 属性を追加して各フォーム埋め込みコードに一意の値を指定します。フォーム埋め込みコードで、formId 属性値の後にコンマ (,) を追加し、新しい行を入力して「formInstanceId: '[番号]'」と入力します。ページに表示される順番に各フォームに番号を付けることをお勧めします (例: 最初のフォームには「1」、2 番目のフォームには「2」など)。
フォームが古いブラウザに読み込まれない
古いブラウザでは、一部の Javascript が HubSpot の埋め込みコードと競合して、フォームが読み込まれない場合があります。
フォームの読み込みと表示が正しくなされるようにするには、フォーム埋め込みコードごとに target 属性を追加して、フォームを表示する特定のコンテナを指定することができます。
HubSpot の開発者ドキュメントでフォーム埋め込みコードのカスタマイズについて詳細を確認してください。
