HubSpot ページにインタラクティブな Google マップを追加するには、マップの埋め込みコードをコピーして HTML モジュールに追加します。
注: すでに Google マップモジュールに埋め込まれたマップがある場合は、まず HTML モジュールの古いモジュールを交換する必要があります。Google の API が変更されたため、このモジュールのサポートは終了します。
HTML モジュールの既存のマップモジュールを交換するには、次の手順を実行します。
- マーケットプレイスから HTML モジュールをダウンロード します。
- HubSpot アカウントで、ランディングページまたはウェブサイトページに移動します。
- ページにカーソルを置いて、[編集] をクリックします。
- [設定] タブをクリックして、[詳細オプション] を選択します。
- [テンプレート] セクションで、サムネイルにカーソルを置き、[テンプレートを編集] をクリックします。
- 既存の マップモジュールをクリックして、モジュールエディターを開きます。
- 右側のモジュールエディターで、[モジュール名] ドロップダウンメニューをクリックし、[HTML モジュール] を選択します。
- [変更を公開] をクリックします。
テンプレートに HTML モジュールを追加する必要がある場合：
- HubSpot アカウントで、ウェブサイトページまたはランディングページに移動します。
- ページにカーソルを置いて、[編集] をクリックします。
- [設定] タブをクリックして、[詳細オプション] を選択します。
- [テンプレート] セクションで、サムネイルにカーソルを置き、[テンプレートを編集] をクリックします。
- テンプレートエディターで、右側のサイドバーの [+追加]をクリックします。
- 検索バーを使用してHTMLモジュールを検索します。モジュールをテンプレートの場所にドラッグ＆ドロップします。
- [変更を公開] をクリックします。
テンプレートに HTML モジュールが追加されたら、ページにマップを追加できます。
- Google マップに移動します。
- 検索バーを使用してアドレスを検索します。
- [共有] をクリックし、 [マップを埋め込む] を選択します。
- サイズをカスタマイズしたら、[HTML をコピー] をクリックします。
- HubSpot で、ウェブサイトページまたはランディングページに移動します。
- ランディングページにマウスを置いて、[編集] をクリックします。
- 左側のサイドバーで [モジュールを編集] をクリックします。
- HTMLモジュールを選択します。Google マップからコピーした HTML コードを [HTML] フィールドに貼り付けて、[保存] をクリックしてモジュールリストに移動します。
- 右上隅の [更新] をクリックして、変更を公開します。