SNSフォローボタン
マヒロをフォローする

【図解】【簡単】 googleマップをブログ(ワードプレス)に挿入する方法 

プログ
この記事は約2分で読めます。

こんにちわ。マヒロです (@mahironomado

グルメ、旅行、ドライブの記事を書いた時にお店や場所の情報に地図を挿入する時の方法を簡単に説明いたします

手順はシンプル!!

  • Googleマップで目的の場所を検索
  • 地図を埋め込むためのHTMLをコビー
  • ワードプレスの本文に挿入する

これだけなんです!!

では具体的に画像・イラストを使って今回は『札幌ドーム』地図をブログに挿入してみます

1.まずはブラウザでGoogleマップを開きます

 

2.左上の検索欄に『場所』を入力する

『札幌ドーム』と入力し、検索ボタンをクリック

検索した場所が表示されます

3.共有ボタンをクリックします

4.『地図を埋め込む』 をクリックします

共有をクリックすると、リンクを共有するが選択されているため、地図を埋め込むをクリックし選択する。

 

挿入する地図のサイズを選択します

次は、実際に貼り付ける際の大きさを選択します

【サイズのまとめ】
「小」→横400px 縦300px
「中」→横600px 縦450px
「大」→横800px 縦600px
「カスタムサイズ」…自由に数字を設定できる

貼り付けたい場所に合わせて大きさを選択するのですが

それぞれの具体的なイメージがこちらになります

 

「小」→横400px 縦300px

「中」→横600px 縦450px

「大」→横800px 縦600px

「カスタムサイズ」…2000×800

具体的にこのようなイメージの大きさになります

個人的には、小、中、大のみの選択で初めは十分と考えます

HTMLをコピーをクリックします

コピーしたHTMLをブログに挿入する

ここでの注意点はただ一つ

編集形式をビジュアルではなく、テキストに変更してから挿入する事!!!!!

それだけです

ちなみに、ビジュアルで貼り付けすると

このようになってしまいますキャ━━━━(゚∀゚)━━━━!

 

以上

ブログにGoogleマップを挿入する方法です

いかがでしたでしょうか

自分の備忘録的に方法をまとめてみました。

ブログ初心者の方の参考になれば幸いです。

 

 

 

コメント

%d人のブロガーが「いいね」をつけました。
タイトルとURLをコピーしました