アメブロの記事内にGoogleマップを埋め込む方法

アメブロの記事にGoogleマップを埋め込みたい方はたくさんいるかと思います。特に店舗をお持ちの方は必要かと思います。通常埋め込みコードを貼っても、禁止タグが入っていますとエラーになってしまいますが、実は方法があるんですよね。

Googleマップの埋め込みコード取得

まずは、検索窓に指定の住所を入力します。
(住所でなくても、地図にのっているお店なら名称でもOK)

検索窓の下の地図をクリック。


共有をクリック。


地図を埋め込むをクリック。


埋め込みコードをコピー

左上にある 中▼ でサイズの変更が可能です(3カラムの方は小を選択すると良いでしょう、2カラムの方は中でOKです)

アメブロに設置

アメブロの記事を書くから、通常表示からHTML表示に切り替える。


HTML表示に切り替えた本文にGoogleマップで取得したコードを貼り付ける。

この時にallowfullscreenという部分を削除する

この作業をすることで、禁止タグのエラーが出なくなります。


通常表示に戻るとGoogleマップが表示されているかと思います。

あとは、その他必要事項(テキストなど)を入れ、公開すれば出来上がり!!

まとめ

如何でしたか?そんなに難しくはないかと思います。

アメブロの禁止タグって何が悪さしているかわからないですよね。どれを消して良いものかもわからないし。。。

これで、お店をやっている方もアメブロで案内できますね(^_-)-☆

コメントを残す

ABOUTこの記事をかいた人

伝説プロデューサー岩本あきら

起業家、サロン経営者、人気カウンセラー、セラピスト、飲食店などにブログ、SNSを使ったマーケティング、コンサルティングを行っています。WEBサイトの制作、WEBツールの活用でサポートを行っています。