修正：このページはGoogleマップを正しく読み込めません

Googleマップは、世界中のどこにでも地理的な地域と道路地図を提供するWebベースのマッピングサービスです。ただし、一部のウェブサイトの所有者には、「このページはGoogleマップを正しく読み込めません」というエラーが表示されます。 Googleマップをロードする代わりに」。このエラーは、「このページはGoogleマップを正しくロードしませんでした。技術的な詳細については、JavaScriptコンソールをご覧ください 」。

注： このソリューションは、従来のユーザーではなく、Webサイトの所有者を対象としています。

Googleマップが正しく読み込まれない原因は何ですか？

Googleマッププラグインはエラーなしでうまく機能しますが、Googleが地図が埋め込まれたウェブサイトのルールを変更したとき、過去数年間で状況が変わりました。ウェブサイトの所有者は、埋め込まれたコードを使用するだけでこれを機能させることができましたが、現在はGoogleマップが正しく機能するためにAPIキーが必要です。すでにAPIキーを追加している場合は、Chromeの[要素の検査]-> [コンソール]タブを表示して、Googleがサイトでマップを許可していない正確な理由を確認できます。これは、キーが正しくない、キーが制限されているなどの原因である可能性があります。

サイト設定にGoogleAPIキーを追加する

プロジェクトまたはウェブサイトでGoogleマップを機能させるには、Google APIキーを作成し、サイトの設定に追加する必要があります。キーを作成し、その他のエラーのトラブルシューティングを行うには、GoogleDevelopersにログインする必要があります。

マップのスクリプトを手動で挿入した場合は、YOUR_API_KEY

 <script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"
  type="text/javascript"></script>

WordPressは世の中で最も人気のあるCMSであり、1億7200万を超えるウェブサイトがWordPressを使用しています。 WordPressのみの手順を示します。

1. Googleマップに使用しているプラ​​グイン設定に移動すると、APIキーを追加するオプションが表示されます。ない場合は、古いバージョンのプラグインまたは古いプラグインを使用している可能性があります。
2. WordPressサイトのAPIキーの設定を開いたままにします。
3. GoogleのCloudResourceManagerに移動します
4. まだログインしていない場合はGoogleにログインします
5. 「プロジェクトの作成」をクリックします 」、プロジェクトに名前を付け、「作成」をクリックします 」
6. Googleの有効化APIウェブページにアクセスします。
7. [プロジェクトを選択]をクリックします 」を上に表示し、作成したばかりの新しいプロジェクトを選択して、続行
8. 「APIとサービスを有効にする」を押します 」
9. 「MapsJavaScriptAPI」を検索します 」と開きます
10. 次に、[有効化]を押します " ボタン
11. [ナビゲーション]メニューをクリックし、[APIとサービス]を選択します 」をクリックし、「クレデンシャル」に移動します 」
12. [資格情報の作成]ドロップダウンをクリックし、[APIキー]を選択します 」
    注 ：必要に応じて、不正使用を防ぐためにキーを制限することができます
13. 「閉じる」をクリックします 」次に、作成したキーをクリックします
14. 「HTTPリファラー」を選択します 」のアプリケーション制限
15. ウェブサイトのURLを追加し、[保存]をクリックします 」
16. キーをコピーして、WordPressサイトに戻ります
17. 左パネルの下にスクロールして、[設定]に移動します 」
18. 「GoogleAPIキー」のオプションがあります 」、それを開いてそこにキーを貼り付けます。
19. 設定を保存し、ページに移動して更新します。

注： グーグルは300ドル相当のクレジットまたは12ヶ月の無料使用のみを許可しているため、請求が有効になっていることを確認してください（どちらか速く減少します）。その後、課金を設定して実装する必要があります。