WordPressにGoogleマップを埋め込む方法について

WordPressにGoogleマップを埋め込むには、Googleマップから取得した埋め込み用HTMLコードを使用するのが最も簡単で一般的な方法です。

主に【1. 埋め込みコードの取得】と【2. WordPressへの貼り付け】の2ステップで完了します。

1. 埋め込みコードの取得

  1. Googleマップを開く ウェブブラウザでGoogleマップ（https://www.google.co.jp/maps/）にアクセスします。
  2. 埋め込みたい場所を検索 埋め込みたい住所や施設名を検索窓に入力して、地図上に表示させます。
  3. 「共有」をクリック 地図の左側に表示される場所の情報パネルにある**「共有」**ボタンをクリックします。
  4. 「地図を埋め込む」を選択 表示されたダイアログで**「地図を埋め込む」**タブを選択します。
  5. サイズを選んでコードをコピー 地図のサイズを「小」「中」「大」、または「カスタムサイズ」から選び、表示された埋め込みコード（iframeから始まるHTML）の**「HTMLをコピー」**をクリックします。

2. WordPressへの貼り付け

埋め込みコードをコピーしたら、WordPressの編集画面で以下の手順で貼り付けます。

ブロックエディタ（Gutenberg）の場合

  1. 地図を表示したい投稿または固定ページの編集画面を開きます。
  2. 地図を挿入したい場所に新しいブロックを追加します。
  3. ブロック検索で**「カスタムHTML」**ブロックを選んで追加します。
  4. 「HTMLを入力…」という欄に、ステップ1でコピーした埋め込みコードを貼り付けます。
  5. **「プレビュー」**をクリックして、地図が正しく表示されるか確認します。
  6. **「更新」または「公開」**して変更を保存します。

クラシックエディタの場合

  1. 地図を表示したい投稿または固定ページの編集画面を開きます。
  2. エディタ画面の右上にある**「テキスト」**タブ（または「HTML」タブ）に切り替えます。
  3. 地図を挿入したい箇所に、コピーした埋め込みコードを貼り付けます。
  4. **「ビジュアル」**タブに戻り、地図のプレビューを確認します。
  5. **「更新」または「公開」**して変更を保存します。

ウィジェットとして埋め込む場合（フッターやサイドバーなど）

  1. WordPressの管理画面から**「外観」** → **「ウィジェット」**へ進みます。
  2. 地図を配置したいウィジェットエリア（例：フッター、サイドバーなど）に**「カスタムHTML」**ウィジェットを追加します。
  3. ウィジェットのテキストエリアに、コピーした埋め込みコードを貼り付けます。
  4. ウィジェットを**「保存」**し、サイト側で確認します。