簡単!WordPress(ワードプレス)にGoogleマップを埋め込む方法を解説

WordPressサイトにGoogleマップを追加する方法についてご紹介します。

今回は、プラグインを使用しない方法を中心に説明します。

Googleマップを利用することで、店舗の場所や特定のエリアの情報を視覚的にわかりやすく表示することができるのでぜひ活用していきましょう。

Googleマップの埋め込みコードを取得

まず最初に、Googleマップで表示したい場所を検索します。

目的の場所が表示されたら、左上のメニューアイコン(三本線)をクリックし、「地図を共有または埋め込む」を選択します。

「地図を埋め込む」タブをクリックし、表示されるHTMLコードをコピーします。

埋め込む地図のサイズは4種類から選べます。サイズを自由に設定したい場合は、「カスタム」を選択します。

サイズカスタム
幅×高さ(px)400×300600×450800×600自由に設定

WordPressに埋め込みコードを追加

クラシックエディタとブロックエディタでやり方が異なるようですが、今回はブロックエディタに限って紹介します。

次に、WordPressの記事編集画面に移動します。

編集画面に左上ある「+(ブロック挿入ツールを切り替え)」ボタンをクリックし、編集カテゴリの中にある「カスタムHTML」ブロックを選択します。

編集画面に追加された「カスタムHTML」ブロック内に、先ほどGoogleマップでコピーしたコードを貼り付けます。

コードを貼り付けた後、「プレビュー」をクリックして地図が正しく表示されることを確認して問題なければOK!

まとめ

Googleマップの埋め込みは簡単にでき、得られるメリットも大きいです。

ユーザーに地図を表示させることで、自社サービスの評価や写真などの情報を見てもらいやすくなります。

そのため、ユーザーに訪問してもらいたい場合には、ぜひ活用すべきです。

ガンガン使っていきましょう〜!

参考記事 https://wpmake.jp/contents/customize/add_googlemaps/