サイト運営をしていると企業や観光地、お店の場所をサイト内に掲載するシーンがあると思います。
そんな時はGoogle Mapを埋め込みましょう。
住所をテキストで記載するより、Google Mapを埋め込む方が視覚的に分かりやすく、周辺情報も確認が出来て便利です。また、スマホからアクセスしたときはGoogle Mapのアプリからも開くことが出来るので目的地までの行き方や路線情報もあわせて確認がすることができます。
目次
手順
（１）Google Mapの画像を埋め込むためのURL取得
（２）WordPressに上記（１）で取得したURLを貼り付け
Google Mapの画像を埋め込むためのURL取得方法
Google Mapにアクセス
まずはGoogle Mapにアクセスします。
埋め込みしたい住所の入力
左上の検索欄（Googleマップを検索する）に、埋め込みしたい住所を入力します。住所が分からない場合は建物名や店名でも検索することができます。
検索結果が表示されるとその場所に赤いピン(マーカー)がセットされます。
共有ボタンをクリック
Google Map左側にあるサイドパネルの「共有」ボタンをクリックします。
この共有ボタンはFacebookやTwtterでリンクを共有したいときにも使うボタンです。リンク先のURLの表示、コピーをしたい時に利用するボタンです。
「地図を埋め込む」をクリック
デフォルト表示だと通常のURLをコピーできる画面になります。
このURLは以前は長いパラメーターになっており、短縮URLにしたい場合は別途「短縮URL」のチェックボックスにチェックをいれて短縮URLを発行していましたが、現在（2019年12月）は自動的に短縮URL発行になります。
地図の大きさを調整
埋め込みをしたときの地図の大きさ（縮尺）を調整することができます。（デフォルトは「中」です）
カスタム設定も出来るので希望の大きさ（縮尺）に調整します。
WordPressにGoogle Map画像のURLを埋め込む方法
コピーしたGoogle Mapの地図画像のURL（HTML）をWordPressの編集画面に貼り付けていきます。
「ビジュアル」画面ではソースコードとして認識されませんので、右上のタブの選択から「テキスト」を選択して貼り付けます。
「テキスト」で編集が終わったら、「ビジュアル」に選択を戻します。
するとソースコードが読み込まれGoogle Mapの画像が読み込まれた状態で表示されていることを確認することができます。
実際に埋め込みした画像が以下です。
■埋め込みした画像
まとめ
操作方法はいたって簡単です。一度覚えてしまえば、クリックとコピーと貼り付けをするだけで簡単にGoogle Mapを埋め込みすることができます。便利な機能ですのでぜひ覚えておきましょう。
関連の書籍