【簡単!】アメブロへのGoogleMap(グーグルマップ)の埋め込み方

アメブロ グーグルマップ

こんにちは!

櫻井法恵(のりんちゅ)です。

 

自宅サロンやお店をされている場合。

イベントの場所を提示して告知したい場合。

住所が書いてあるだけじゃなくて、地図も入っているとわかりやすいですよね~!

 

でね。

知らない方も多いんですが、実はめっちゃ簡単に、アメブロの記事内にGoogleマップを埋め込むことができるんですよ~♪

という事で、今回はアメブロ記事の中にGoogleマップを埋め込む方法をお伝えします。

アメブロへのGoogleマップの埋め込み方

まずはGoogleマップを開いてください。 ▶Googleマップ

Googleマップで住所を入力、地図を表示させる

マップに、お店の名前や該当の住所などを入力して検索します。

アメブロ グーグルマップ

今回は、家族でよく行く公園で試しております・・・

 

該当の場所が出てきたら、【共有】→【地図を埋め込む】から、出てきたHTMLをコピーします。

アメブロ グーグルマップ

 

ちなみに、地図は【中】のサイズで出てきますが、横の【▼】ボタンをクリックすると・・

アメブロ グーグルマップ

 

【小】【大】【カスタマイズ】等も出てくるので、好きな大きさを選べます。

アメブロ Googlemap

ブログのデザインやレイアウトによって、【小】くらいいの大きさの方がちょうどいい場合もあるので、地図を貼りつけて、試してみてくださいね。

のりんちゅ先生
私は、告知記事の中などにマップを埋め込む時は【小】のサイズで使う事が多いです!

 

集客ブログにするためのアメブロデザインの設定は「スタンダード」一択!

2018.06.19

【保存版】読まれるブログにするためには絶対必須!アメブロの整え方9つのポイント

2018.04.19

 

【カスタマイズ】にすると、こんな感じで自分で大きさが選べます♪

アメブロ Googlemap

 

Googleマップの情報をアメブロに貼り付ける

さて、地図情報のHTMLをコピーできたらアメブロを開きます。

【記事を書く】を開いて【HTML表示】のタブに切り替えてください。

アメブロ グーグルマップ
のりんちゅ先生
必ずHTML表示を開くんですよ~!!!

 

そして、コピーしたHTMLを貼りつけます。

アメブロ グーグルマップ

 

【通常表示】に戻すと、こんな感じで地図が埋め込まれています♪

アメブロ グーグルマップ
のりんちゅ先生
この画面やプレビュー画面でクリックしてもグーグルマップには飛びません。
公開した記事で、きちんとGoogleマップに飛ぶか、試してみてくださいね!

 

告知記事や案内記事の詳細の中に入れておくとわかりやすくなりますよ~♪

集客のために告知記事に書きたい事はこちらをご覧くださいね。

アメブロ集客の要!告知記事に絶対に書きたい9つの項目はこれだ!

2018.06.08

 

まとめ

サロンやお教室だと、住所が書いてあるだけだと検索しないといけなくてちょっとめんどくさい・・・。

また、イベントの際なども、告知のページに地図が埋め込まれているととってもわかりやすいです♪

Googleマップにアクセスして経路検索して簡単にたどり着けちゃうから、来ていただく際にも迷子になりづらいですよね~!

あとは、カフェやレストラン、施設などの紹介記事を書いた時なんかも、Googlemapが貼りつけられているととっても親切♡

 

という事で・・

アメブロ記事へのGooglemapの埋め込み、ぜひやってみてくださいね^^

 

地図とともに、「スマホから、電話番号タップで電話がかけられる設定」も大切よ!

こちらも簡単なのでやってみてくださいね~

【簡単!】ブログの電話番号にリンクを貼って、スマホからタップして電話をかけられるようにしよう!

2018.06.22

ABOUTこの記事をかいた人

櫻井 法恵

ビジネスのための魅せるアメブロ・Facebook作りのアドバイザー。 2014年に事務管理・ブログ管理として起業。 2016年より、講師&アメブロコンサルタントとして活動を開始。 アメブロとFacebookのみを使い、約2年間でのべ500人を集客する。