【最新版】画像付きでわかりやすく解説します！
WordPressでGoogleマップを埋め込むたった3つのステップを解説します。
近年、ブログやECサイトにおいて、店舗情報やサービスエリアなどを視覚的にわかりやすく伝えるために、Googleマップを埋め込むことが一般的になっています。
しかし、初心者にとって、WordPressにGoogleマップを埋め込むのはハードルが高いと感じるかもしれません。
そこで今回の記事では、WordPressにGoogleマップを簡単に埋め込む方法を、初心者にもわかりやすく解説します。
本記事では、以下の3つのステップで、スムーズにGoogleマップを埋め込むことができます。
- Googleマップで埋め込みコードを取得
- WordPressの投稿編集画面で埋め込みコードを貼り付け
- プレビューで確認して公開
たった3つのステップで、誰でも簡単にGoogleマップを埋め込むことができます。
Googleマップを埋め込むメリット
- 店舗情報やサービスエリアを視覚的にわかりやすく伝えられる
- 顧客の利便性を向上させ、集客効果を高める
- SEO対策にも効果的
Googleマップを埋め込む前に準備するもの
- Googleアカウント
- WordPress管理画面へのアクセス権
- 埋め込みたい場所の住所
GoogleマップをWordPressに埋め込む前に、以下のものを準備する必要があります。
Googleアカウント
Googleマップを埋め込むためには、Googleアカウントが必要です。
Googleアカウントを持っていない場合は、新規で取得しましょう。
WordPress管理画面へのアクセス権
WordPressにGoogleマップを埋め込むためには、WordPress管理画面へのアクセス権が必要です。
アクセス権を持っていない場合は、ブログの管理者に依頼する必要があります。
Googleマップで埋め込みコードを取得
- Googleマップで、埋め込みたい場所を検索します。
- 場所のピンをクリックし、「共有」ボタンをクリックします。
- 「地図を埋め込む」タブをクリックします。
- 埋め込みコードのサイズを選択します。
- 「HTMLをコピー」ボタンをクリックして、埋め込みコードをコピーします。
WordPressの投稿編集画面で埋め込みコードを貼り付け
- WordPress管理画面にログインし、投稿編集画面を開きます。
- 埋め込みコードを貼り付けたい場所にカーソルを移動します。
- 「テキスト」タブをクリックします。
- 先ほどコピーした埋め込みコードを貼り付けます。
- 埋め込みコードが正しく表示されていることを確認します。
プレビューで確認して公開
- 投稿画面右上の「プレビュー」ボタンをクリックして、埋め込みコードが正しく表示されていることを確認します。
- 問題がなければ、「公開」ボタンをクリックして投稿を公開します。
WordPressでグーグルマップが表示されない時の原因と対処法
WordPressでGoogleマップを埋め込んでも、正しく表示されない場合があることがあります。
以下に、考えられる原因と対処法を詳しく解説します。
APIキーの設定が間違っている
2018年以降、GoogleマップをAPIで利用するには、APIキーの取得と設定が必要になりました。
APIキーの設定が間違っていると、マップが表示されません。
対処法
- Google Cloud Platformコンソールにアクセスし、APIキーを作成または設定する。
- 正しいAPIキーを、埋め込みコード内に設定する。
埋め込みコードが間違っている
Googleマップの埋め込みコードには、様々なオプションが含まれています。
埋め込みコードに誤りがあると、マップが表示されません。
対処法
- 埋め込みコードをもう一度確認し、誤りがないことを確認する。
- わからない場合は、Googleマップのヘルプドキュメントを参照する。
プラグインのバージョンが古い
使用しているプラグインのバージョンが古い場合、Googleマップとの互換性が失われている可能性があります。
対処法
- プラグインを最新バージョンに更新する。
- 最新バージョンでも問題が解決しない場合は、別のプラグインを試してみる。
サーバーの容量が不足している
Googleマップの表示には、ある程度のサーバー容量が必要です。
サーバーの容量が不足していると、マップが表示されないことがあります。
対処法
- サーバーの容量を増やす。
- 画像圧縮などの対策を行う。
キャッシュの問題
ブラウザやサーバーのキャッシュが原因で、古いマップが表示されている可能性があります。
対処法
- ブラウザのキャッシュをクリアする。
- サーバーのキャッシュをクリアする。
その他の可能性
上記以外にも、様々な原因が考えられます。
対処法:
- 上記の対処法を試しても問題が解決しない場合は、以下の方法を試してみる。
- WordPressのテーマを変更してみる。
- 別のブラウザで試してみる。
- Googleマップのサポートに問い合わせてみる。
WordPressでGoogleマップが表示されない場合は、上記の原因と対処法を参考に、問題解決に向けて取り組んでみてください。
参考資料
- Googleマップ ヘルプ: https://support.google.com/maps/?hl=ja#topic=3092425