宮城のSAKUだっちゃ
毎日が新しい発見で楽しいです
ブログ

WordPressでGoogleマップが表示されなくなった時

私の「食べ歩きブログ」は、ブログの最後にアクセスマップを掲載しています。

そのアクセスマップにはGoogleマップを使用していましたが、突然下のような画面が出て地図が表示されなくなりました。

「接続拒否されました」という言葉はショックでした。

私は初心者なので詳しい事は分かりませんが、数日前に何個かプラグインの更新がありました。そのあとに表示されなくなったので、おそらくその中のどれかが原因だと思います。

どうだかね。。。

WordPress付属のGoogleマップの表示方法

WordPressは初心者用にGoogleマップを簡単に表示させる機能があります。

ブロック追加の「すべて表示」で画面の左側に出てくるアイコン一覧の中から地図のアイコンをクリック

「住所」入力の画面が出てきます。

「住所」を直接入力するか「コピペ」で入力し「検索ボタン」をクリックするだけで地図が表示されます。

数日前まで、これだけで簡単に「マップ」が表示出来たので、初心者にはとても優しい機能でした。

ところが突然、同じことをやっても表示されないし、過去ブログの全マップが消えてしまいました。

どうしようかと悩んで色々調べていたら、「地図の埋め込み」があることを知りました。

そこで、おそるおそる「地図の埋め込み」を試してみたら 意外と簡単だったので「過去ブログ」を全部やり直しをしました。

私と同じ初心者で、同じような症状で困ってる人は参考にして頂ければと思います。

Googleマップの埋め込み作業

地図埋め込み手順
  1. Googleマップを開く
  2. 住所を入れて場所を検索する
  3. 左上の三本線をクリックすると左にアイコンが表示される
  4. アイコンの中から「地図を共有または埋め込む」を選択
  5. 地図の上にある「地図を埋め込む」をクリックする
  6. HTMLが表示されるので「HTMLをコピー」をクリック
  7. WordPressのブログ作成画面に戻る
  8. HTMLカスタムをクリックする
  9. HTML入力画面にコピーしたHTMLをペーストする
  10. 地図が表示される

①~③ Googleマップで場所を検索

① Wordpressのブログ作成画面とは別画面でGoogleマップを開く

② 住所を入れて場所を検索する

③ マップの左上に表示される三本線をクリックする。

④  地図を共有または埋め込む

三本線をクリックすると、画面の左側にアイコン一覧が出てくるので「地図を共有または埋め込む」を選択します。

⑤ 地図を埋め込むを選択

Googleマップの画面に出てくる選択画面から「地図を埋め込む」を選択する。

⑥ 「HTMLをコピー」をクリック

「HTML」が表示されるので、「HTMLをコピー」をクリックしてコピーする。

⑦ Wordpressのブログ作成画面に戻る

WordPressのブログ作成画面に戻ってマップを挿入する場所を選択する。

⑧ カスタムHTMLを選択する

ブロックの追加をクリックして画面左側に出てくる下記アイコンを選択する。

⑨ HTML入力個所にコピーしたHTMLをペーストする

選択したブロックの「HTMLを入力」の場所に⑥でコピーしたHTMLをペーストする。

⑩ ブログにGoogleマップが表示されます。

プレビューでGoogleマップが表示されて位置の微調整が出来ます。

この作業を繰り返して過去ブログを修正する事が出来ました。


ポイント10倍 コーヒー豆 コーヒー 2kg 怒涛の珈琲豆セット (G500×4) 珈琲豆 送料無料 加藤珈琲/グルメコーヒー豆専門加藤珈琲店/珈琲豆

POSTED COMMENT

  1. R より:

    「8.カスタムHTMLを選択する」は行わず、空の段落にペーストしても「カスタムHTMLを選択した」のと同じ結果になります。少しですが手間が省けます。お試しください。

  2. R より:

    空の段落にペーストしても……とコメントしましたが、Wordpressのバージョンによっては「カスタムHTML」ではなく「埋め込みURL」になるようです。お騒がせしました。

コメントを頂けると励みになりますので宜しくお願いします。