見込み顧客にとって、ビジネスを訪れたいのに場所がわからないほどイライラすることはありません。ウェブサイトで場所を見つけやすくしていないために、多くの地域ビジネスが売上を失っているのを見てきました。
だからこそ、すべてのローカルビジネスのウェブサイトには、適切に埋め込まれたGoogleマップを含めるべきなのです。
Googleマップを追加することで、訪問者があなたのローカルビジネスを見つける方法に大きな違いが生まれることがわかりました。これにより、場所を特定するのがはるかに簡単になり、全体的なユーザーエクスペリエンスを大幅に向上させることができます。
WordPressサイトにGoogleマップを追加する正しい方法をご紹介します。これは単に古いマップを挿入するだけではありません。高速に読み込まれ、プロフェッショナルに見え、実際にあなたのビジネスが見つけられるのに役立つように、正しく行う方法を教えます。

WordPressにGoogleマップを追加する理由
Googleマップがすべてのプラットフォームで最も人気のあるナビゲーションアプリであることをご存知でしたか?
オフィスや実店舗の住所がある場合、WordPressウェブサイトにGoogleマップを追加すると、ユーザーは実店舗、レストラン、小売店などを簡単かつ迅速に見つけることができます。これにより、より多くの顧客を引き付け、より多くのビジネスを生み出すことができます。
それだけでなく、Googleマップを埋め込むことで、WordPressのSEOを改善することもできます。Googleによると、検索の46%はローカル検索です。WordPressにGoogleマップを追加すると、ローカルSEOを強化し、ローカル検索での表示順位を向上させることができます。
WordPressにGoogle Mapsを埋め込む方法は現在2つあり、両方ご紹介します。
2番目の方法の利点は、すべてのローカルSEOのベストプラクティスに従っているため、これを使用すると、GoogleはGoogleマップにあなたの場所を含めるようになります。また、ローカル検索結果に名前、ロゴ、住所、電話番号、営業時間などのビジネス情報が表示されます。
それでは、WordPressにGoogleマップを追加する方法を見てみましょう。以下は、お好みのセクションに移動するために使用できるクイックリンクです。
- プラグインなしでWordPressにGoogleマップを追加する方法
- How to Add Google Maps to WordPress With a Local SEO Plugin
- Google マップに関するよくある質問
- WordPressでマップを使用するためのエキスパートガイド
プラグインなしでWordPressにGoogleマップを追加する方法
WordPressの投稿やページにGoogleマップを簡単に埋め込みたい場合は、デフォルトのiFrameメソッドを使用できます。
Google マップのウェブサイトにアクセスし、検索エリアに任意の番地を入力するだけです。

次に、共有アイコンをクリックすると、場所リンクを送信するかマップを埋め込むかのオプションが表示されるポップアップが表示されます。
「マップを埋め込む」オプションを選択する必要があります。

その後、GoogleマップのHTMLコードをコピーし、マップを埋め込みたいページを開きます。
ブロックエディター内で、カスタムHTMLブロックを追加する必要があります。

これで、Googleマップからコピーした埋め込みコードを貼り付けるだけです。
その後、変更をプレビューするには、ページを更新または公開する必要があります。

この方法はGoogleマップをすばやく埋め込むのに役立ちますが、SEO上のメリットを最大限に引き出すことはできません。
小規模ビジネス、レストラン、または単一または複数の実店舗を持つオンラインストアを経営している場合は、Googleでのランキングを上げるのに役立つ適切なオープングラフデータを使用するため、次のソリューションを使用してローカルSEOランキングを最大化することをお勧めします。
ローカルSEOプラグインを使用してWordPressにGoogleマップを追加する方法
Googleマップを追加し、ローカルSEOのためにサイトを最適化する最良の方法は、All in One SEO (AIOSEO)を使用することです。
これはWordPressの最高のSEOプラグインです。なぜなら、コードを編集したり開発者を雇ったりすることなく、SEOランキングを向上させることができるからです。300万人以上のプロフェッショナルがAIOSEOを使用して検索エンジンのランキングを向上させています。

このチュートリアルでは、ローカルSEO機能やその他の強力な最適化オプションが含まれているため、AIOSEO Pro版を使用します。検索エンジン向けにサイトを最適化するために使用できるAIOSEOの無料版もあります。
まず、WordPressにAIOSEOプラグインをインストールして有効化する必要があります。詳細については、WordPressプラグインのインストール方法に関するチュートリアルをご覧ください。
アクティベーション後、プラグインはセットアップウィザードを起動します。プラグインを設定するには、「開始する」ボタンをクリックできます。ヘルプが必要な場合は、WordPressでAll in One SEOを正しく設定する方法に関するガイドを参照してください。

次に、WordPressダッシュボードから All in One SEO » Local SEO に移動できます。
次に、「ローカルSEOを有効化」ボタンをクリックして、ローカル設定の構成を開始します。

WordPress 用 Local SEO アドオンを有効にすると、AIOSEO で単一または複数の場所を追加し、Google マップに表示できます。両方をウェブサイトに追加する方法を説明します。
単一の場所を追加する
場所、ビジネス情報、営業時間などを追加するには、まずAll in One SEO » Local SEOに移動し、「Locations」タブを開く必要があります。
物理的な場所が1つしかない場合は、「複数の場所」オプションを「いいえ」に設定したままにしてください。

その後、「マップ」セクションまでスクロールして、正確な場所をピン留めします。
「クエリを入力」フィールドに住所を入力するだけで、Google マップが現在地を表示します。

場所を入力したら、「変更を保存」ボタンをクリックするのを忘れないでください。
複数のロケーションを追加する
物理的な場所が複数ある場合は、ローカルSEOの「場所」タブで「複数の場所」設定を有効にする必要があります。

その後、WordPressの管理画面に新しい「Locations」メニューが表示されます。
「場所」に移動し、「新規追加」ボタンをクリックしてください。

WordPressエディターに入ったら、「マップ」セクションまでスクロールダウンします。
ここで、「クエリを入力」フィールドに住所を入力できます。

マップに場所を入力し、場所情報を追加したら、「発行」ボタンをクリックしてください。
これで、この手順を繰り返して、ビジネスに好きなだけ多くの場所を追加できるようになりました。
場所の追加が完了したら、All in One SEO » Local SEOメニューに戻り、「Maps」タブに移動できます。
ここで Google マップ API キーを入力する必要があります。

それでは、GoogleマップのAPIキーを作成する方法を見てみましょう。
Google Maps APIキーの作成
開始するには、Google Maps Platformのウェブサイトにアクセスし、「開始する」ボタンをクリックする必要があります。

Googleアカウントでサインインした後、請求先アカウントを設定する必要があります。
Google Maps Platformは従量課金制の料金設定を採用しており、毎月の利用料金の最初の300ドルは全ユーザーに無料で提供されます。ほとんどのウェブサイトでは、この無料枠で、このチュートリアルで作成しているような簡単なマップ埋め込みを十分にカバーできます。
心配しないでください。手動で有料アカウントにアップグレードしない限り、料金は請求されません。
開始するには、「請求先アカウントを作成」ボタンをクリックしてください。

次に、国を選択し、ドロップダウンメニューから組織を最もよく表すものを選択できます。
この情報が選択されたら、利用規約のチェックボックスをクリックし、「続行」ボタンをクリックします。

次の画面で、確認のために電話番号を入力する必要があります。
それが完了したら、「コードを送信」ボタンをクリックします。

コードを確認したら、次にビジネス名、支払い方法の詳細、請求先住所を入力します。
これらの詳細を入力したら、「無料トライアルを開始」ボタンをクリックしてください。

次に、組織とGoogle Maps Platformの使用方法について、一連の4つの質問に回答するように求められます。
Googleマップは、プラットフォームを使用する主な目的、所属する業界、ユースケース、および会社規模について質問します。
これらの質問に回答したら、「送信」ボタンをクリックしてください。

これで、Google Maps APIキーが表示されたポップアップが表示されます。
このキーはコピーしてテキストファイルに保存し、後で再利用できます。

Google マップ API キーを作成したら、WordPress のダッシュボードに戻って AIOSEO ローカル SEO 設定に入力する必要があります。
WordPress で Google マップの設定を構成する
WordPressダッシュボードから All in One SEO » Local SEO に戻り、「マップ」タブに移動できるようになりました。
「APIキー」フィールドにGoogle Maps APIキーを入力してください。キーを追加するとすぐに、AIOSEOでマップのプレビューが表示されます。

次に、マップ設定を編集するために下にスクロールできます。
AIOSEO では、Gutenberg ブロック、ショートコード、ウィジェット、または PHP コードを使用して Google マップを表示できます。また、さまざまなマップスタイルを選択したり、マップにカスタムマーカーを追加したりすることもできます。

完了したら、「変更を保存」ボタンをクリックすることを忘れないでください。
WordPress で Google マップを表示する
次に、WordPressの投稿やページにGoogleマップを追加できます。開始するには、ウェブサイトで新しいページを編集または追加するだけです。
ブロックエディターに入ったら、上部にある「+」ボタンをクリックし、AIOSEO Local – Mapブロックをページ上のどこかに追加します。

その後、Googleマップがページに追加されます。
AIOSEO では、右側のオプションからマップ設定を編集することもできます。たとえば、ラベルやアイコンを表示したり、カスタムマーカーを追加したり、マップの幅と高さを編集したりできます。

複数の場所がある場合は、右側のメニューのオプションから選択して、強調表示する場所を選択できます。
「場所」ドロップダウンメニューをクリックして、ウェブサイトに表示したい場所を選択するだけです。

設定に満足したら、ページを発行してください。
これで、Googleマップが機能しているかウェブサイトにアクセスできます。

また、サイドバーやフッターなど、サイトのウィジェットセクションにGoogleマップを追加することもできます。
まず、WordPressの管理画面から外観 » ウィジェットに移動します。次に、「+」ボタンをクリックし、「AIOSEO Local – Map」ウィジェットブロックを場所を表示したい場所にドラッグ&ドロップします。

その後、ウィジェットの設定を編集できます。
例えば、タイトルを追加したり、マップの幅と高さを変更したり、複数の場所がある場合は表示する場所を選択したり、ラベルを編集したりできます。

これで完了です!
ウェブサイトを更新すると、ウィジェットエリアに Google マップが表示されます。

Google マップに関するよくある質問
ここでは、WordPressサイトにGoogleマップを追加することについて、よく寄せられる質問をいくつかご紹介します。これにより、混乱が解消され、ご自身のウェブサイトにマップを追加する自信が得られるはずです。
1. WordPressにGoogleマップを埋め込むにはGoogle APIキーが必要ですか?
はい、ほとんどのマップ埋め込みが正しく機能するには、GoogleはAPIキーを必要とします。一部の基本的な埋め込みは、最初はキーなしで機能するかもしれませんが、問題や制限に遭遇する可能性が高いです。APIキーの取得は、ほとんどの中小規模のウェブサイトでは無料であり、ガイドで設定方法を説明します。
Googleマップを追加するとWordPressサイトの表示速度は遅くなりますか?
Googleマップは、正しく実装しないとサイトの速度に影響を与える可能性があります。しかし、私たちが概説する適切な方法に従えば、影響は最小限です。ほとんどの最新のテーマやプラグインはマップの読み込みを効率的に処理しており、訪問者がそのセクションまでスクロールしたときにのみマップが読み込まれるように、遅延読み込みを使用することもできます。
3. WordPressでGoogleマップの外観をカスタマイズできますか?
もちろんです!色をカスタマイズしたり、特定の要素を削除したり、カスタムマーカーを追加したり、完全にカスタムなマップスタイルを作成したりすることもできます。多くのWordPressマッププラグインにはカスタマイズオプションが組み込まれていますが、Googleのスタイリングウィザードを使用して、ブランドに合ったマップを作成することもできます。
4. プラグインを使用するのと、Googleマップを直接埋め込むのと、どちらが良いですか?
ほとんどのWordPressユーザーには、専用のマッププラグインの使用をお勧めします。プラグインは、より多くのカスタマイズオプション、優れたパフォーマンス最適化、および簡単な管理を提供します。直接埋め込みも可能ですが、プラグインは通常、複数の場所やカスタムスタイリングなどの追加機能と、よりユーザーフレンドリーなエクスペリエンスを提供します。
5. WordPressサイトでGoogleマップを使用するのにいくらかかりますか?
Google マップは、ほとんどの中小規模のウェブサイトで無料です。Google は月額 200 ドルの無料利用枠を提供しており、これは約 28,000 回の地図読み込みまたは 40,000 回の経路検索リクエストをカバーします。ほとんどのローカルビジネスのウェブサイトはこの制限を超えることはないため、実質的に無料で利用できます。
6. 1つのGoogleマップに複数のビジネス拠点(ロケーション)を追加できますか?
はい、1つのマップに複数の場所を追加することは間違いなく可能です。これは、複数の支店やサービスエリアを持つビジネスに最適です。ほとんどのWordPressマッププラグインでは、複数のマーカーを簡単に追加でき、各場所を異なる情報、色、アイコンでカスタマイズできます。
WordPressでマップを使用するためのエキスパートガイド
サイトに Google マップを追加する方法がわかったので、WordPress のマップと場所に関連する他のガイドを確認すると良いでしょう。
- WordPressにBingマップを埋め込む方法(ステップバイステップ)
- WordPressにインタラクティブマップを追加する方法
- お問い合わせフォームにGoogleマップを埋め込む方法(地図ピン付き)
- WordPress向けのベストGoogleマッププラグイン(ほとんど無料)
- WordPressにGoogleマップストアロケーターを追加する方法
- ローカルSEOを強化する最高のWordPressストアロケータープラグイン
- WordPressでローカルビジネスの複数拠点スキーマを追加する方法
- WordPressで住所フィールドのオートコンプリートを追加する方法
- おすすめのWordPressジオロケーションおよびGeoIPプラグイン
この記事が、WordPressサイトにGoogleマップを追加する方法を学ぶのに役立ったことを願っています。また、中小企業向けのおすすめのMapbox WordPressプラグインや、WordPressにGoogleマップの店舗検索機能を追加する方法についてもご覧ください。
この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterやFacebookでもフォローできます。


マリア・エウヘニア・ベラスコ
とても便利です。最初の試みで地図を置くことができました。
どうもありがとうございました
WPBeginnerサポート
どういたしまして!
管理者
デニス・ムトミ
この分かりやすいガイドをありがとうございます!しかし、助けが必要な問題があります。私のウェブサイトの1つは、テーマのデザインとコーディングがそうなっているため、ダークモードのカラースキームになっています。私もGoogleマップをよく使用しており、ダークモードバージョンが利用可能であることを知っています。
通常バージョンではなく、Googleマップのダークモードバージョンをウェブサイトに追加する方法はありますか?ウェブサイトのダークテーマデザインに合わせて地図を表示したいだけです。
WPBeginnerサポート
現在、埋め込みで地図をダークモードバリアントに変更するための推奨される簡単な方法はありません。変更があった場合は、必ず共有します!
管理者
モイヌディン・ワヒード
これは本当に私にとって時間とリソースを節約できる投稿です。クライアントのウェブサイトにGoogleマップの住所を最小限の方法で追加する方法を探していて、どうすればよいかわからなかったからです。
プラグインなしの方法とAIOSEOを使用する方法の両方とも優れており、私のニーズを満たしています。
しかし、ローカルSEOにも役立つため、この機能を実装するにはAIOSEOを選択します。
Googleマップを埋め込むためのこの役立つガイドをありがとう。
メラニー・バンド
こんにちは、埋め込まれたGoogleマップの下部にある13pxの白い余白を非表示にする方法をご存知ですか?
よろしくお願いいたします。
Melanie
WPBeginnerサポート
CSSの調整については、特定の埋め込みによって異なりますが、要素の検査を使用して変更に必要なCSSを見つけることができます。ここに役立つ可能性のある要素の検査に関するガイドがあります。
https://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/
管理者
ドナータ
ウェブサイトにGoogleマップがありますが、マップに追加したピンがクリックできません。ピンは住所を表示するだけで、クリックしても移動しません。クリック可能なアイコンにすることは可能ですか?
WPBeginnerサポート
ご希望の件については、以下の記事をご覧ください。
https://www.wpbeginner.com/plugins/how-to-add-interactive-travel-maps-in-wordpress/
管理者
シャロン
マッププラグインを使用してプラグインに挿入する前に、GoogleからAPIを取得する必要があるのではないでしょうか?最近の私の経験ではそうです。
Mark
こんにちは、WordPressのウェブサイトにGoogleマップを挿入しようとしていますが、消えてしまいます。Googleはこれに月額200ドル(またはそれ相当の金額)を要求するようになったと理解していますが、それともまだ無料でマップを挿入できますか?
WPBeginnerサポート
Googleは現在、マップAPIの大規模な使用に対して料金を請求しており、プラグインはそのAPI上で動作しています。あなたが目にされた200ドルは、GoogleがAPIを使用するユーザーに提供する無料の月額クレジットであり、小規模なサイトは請求されないようになっています。
管理者
Kamil
はい、それは本当ですが、Google Maps APIの代替手段があります。OSMapperはOpen Street Maps APIを使用するプラグインで、APIキーは不要で、使用制限もありません。Wordpress.orgからインストールできます。
WPBeginnerサポート
まだテストしていませんが、必ず確認します。
Blessy
最初のステップを試しました。埋め込みボタンに移動してから、投稿のテキストバージョンにHTMLを貼り付けました。ビジュアルバージョンに移動すると、埋め込まれたGoogleマップが表示されました。保存すると、サイトはマップを削除します。変更されたテキストは残りますが、マップは消え続けます。試すたびに繰り返されます。なぜですか?
ミランダ・オルディング
ありがとう – とても分かりやすいです x
Sara C
素晴らしいチュートリアルです。短く要点を押さえています。クライアントが気に入らなかった他のプラグインを2つ試しましたが、手動埋め込みの情報、ありがとうございます。完璧かつ迅速に機能しました。
このチュートリアル、本当にありがとうございました。
Sara
デニー・パン
拝啓
Googleマップの住所を変更したいのですが、WPバックエンドを更新するために埋め込みリンクをどこで見つけたらよいかわかりません。連絡先メニューに見つかりませんでした。
それについてご助言いただけますでしょうか!
ありがとうございます!
Rdgs,
Denny Png
キャシー
ありがとうございます!探していたものです!私のブログの旅行記事に最適です!動画も素晴らしく、とても役立ちます!
Divi
すごい仕事だ、ブラザー!!!!
アンディ・クレイマー
これをやりたいのですが、Googleマップに入力して住所を入力しても、ギアが全く表示されないため、WordPressにコピーするリンクさえ取得できません。何かアイデアや提案はありますか?
Karen
全く同じ問題が発生しています。Googleマップに花が表示されなくなりました!これはどのように機能するのですか?
Mari
こんにちは!
コードが見つかりません。マップの右下には「花のアイコン」も他のリンクもありません。これは、追加しようとしている場所に番地がなく、座標だけだからでしょうか?
よろしくお願いします。
Andy Meuleman
素晴らしいレッスンで、分かりやすく実装しやすいです。
ありがとうございます、アンディ
カルティク
このマップをページの背景として、幅100%、高さ100%のように表示する方法はありますか?
Parmod
具体的にどのようなものが必要か、もう少し詳しく教えていただけますか?
Bigg Tobias Inspired
マップのチュートリアルはとても良かったのですが、ページの特定の部分やサイドバーに配置したい場合はどうすればいいですか?どなたか助けていただけますか?
カルラ・スパッチャー
本当にありがとうございます!Googleマップからコードを取得する簡単な手順を提供してくれたのに、なぜわざわざサイトを遅くする可能性のあるプラグインを使う人がいるのでしょうか?
ところで、コードが見つからなくて困っている人がいたら。地図が表示されたら、右下隅に移動して花のアイコンをクリックし、「地図を共有して埋め込む」をクリックしてください。次に「地図を埋め込む」をクリックして、WPページまたは投稿に入力してください。
WRC
ありがとうございます。非常に役立つ投稿です。
ローリー
こんにちは、Googleマップでグループ(BuddyPress)の場所を表示することは可能でしょうか?
ご協力ありがとうございます。
aamir
こんにちは、
正確な場所を提供するプラグインを使用したいのですが、何かおすすめはありますか? MapPress、Leaflet Market、WP Google Mapなどのプラグインを使用しましたが、うまくいきませんでした。これらのプラグインはすべて、私の正確な場所から少し離れた場所を表示します。私の店がある正確な場所が必要です。助けてください。または、カスタムマップを開発してWordPressサイトに配置する方法はありますか?手順を教えてください。
よろしくお願いいたします。
aamir
Trang Tran
この記事を書いてくださりありがとうございます。とても参考になります。Googleプレイスと連携したGoogleマップを追加することは可能ですか?
Guilherme
とても良いですね。しかし、座標を使用すると、ライトボックスマップが正しく機能しません。アメリカのどこかを示しているだけです。これを修正するにはどうすればよいですか?
ありがとう
ボンゴ
すごいね。ありがとう
アーウィン
ナイスでわかりやすい説明です。先日、情報バブルを削除する方法について良いトリックを投稿しました(http://goodwebsites.co.nz/how-to-remove-info-bubble-for-embedded-google-maps)。役立つかもしれません。
Christopher Rose
投稿されている有益なWP記事すべてに感謝します。
サイトに Google マップを追加することは可能ですか?
1. サイト訪問者またはコメント投稿者のすべての場所を地図に自動的に追加し
また
2. すべての顧客を追加できるようにする。おそらく手動で、自動オプションがあればさらに良い。私は世界中に顧客がいる小規模なeコマースサイトを運営しており、どこに商品を発送したかを示すのは楽しいだろうと考えています。
Widdershins
That is so cool! … thanks
zakaria
ありがとうございます!
(MapPress Easy Google Maps)は既に導入済みで、とても良いプラグインです。
そしてもちろん、あなたの丁寧なサポートにも感謝します。ありがとうございます!!!
もう一つお願いがあります。
これらのマップをタブで使用したいのですが、現在見つかったマップを表示できるタブ(ショートコード)プラグインは(Jshortcode)だけです。(2番目または3番目のタブに表示されるという意味です。他のものは2番目または3番目のタブに表示されません。)これも良いプラグインですが、タブがとてもカラフルすぎます。
この問題を解決するために、他のプラグインについてアドバイスをいただけると幸いです。
事前のご連絡ありがとうございます。
よろしくお願いいたします。
Zakaria