ゆとりごと

ゆとりの団子が綴るグルメと旅行と趣味のブログ

HTMLをはてなブログに埋め込む方法、Googleマップを埋め込む方法

スポンサーリンク

 私は暇なときに新着ブログを読み漁るのが好きなのですが、読み漁っているとときどきHTMLの埋め込みができていないブログを見かけます。

f:id:s_dango:20151110103003j:image

 ↑こんな感じ

 HTMLがむき出しになっています。稀にこれでアフィリエイトのリンクを貼っている方もいるくらいです。

 まあ、PCから『見たままモード』で書き込むことに慣れている方はHTML編集なんてあまり使わないですよね。そもそも見たままモードが便利すぎるんですよ!私みたいな『ケータイ世代』は『ホムペ』で何となくHTMLタグというものを知って、Webサイトの作成にはHTMLを使うと学びました。黒歴史のようで案外役立っている経験ですよ。今のブログサービスのように便利で簡単に編集できたらHTMLなんてあまり覚える必要ありませんしね。

 

 前置きはここまで。

 需要の有無はともかく!今回はHTMLの埋め込み方を、Googleマップを使って解説していきます。GoogleマップもHTMLで埋め込みできますので、同時に説明します。

 

Googleマップのコードをコピーするまで

1.Googleマップ左上の三をクリック

f:id:s_dango:20151110114652j:image

 

2.『地図の共有または埋め込み』をクリック

f:id:s_dango:20151110114915j:image

 

3.以下のような画面が表示されますので、『地図を埋め込む』をクリック

f:id:s_dango:20151110115026j:image

 

4.コードが表示されますのでコピーしてください

f:id:s_dango:20151110115258j:image

 

このコードを書き込むことでブログに地図が表示されます。

次はこのコードのブログへ埋め込む方法です。

 

コードの書き込み方

1.記事の編集画面左上にHTML編集という項目があるのでクリック

f:id:s_dango:20151110115559j:image

 

2.するとHTML編集モードに切り替わりますので、コードを埋め込みたいところに書き込んでください

f:id:s_dango:20151110115829j:image

 

3.コードを書き込んだ後に見たまま編集に戻すと、公開せずとも地図が埋め込まれていることが確認できます

f:id:s_dango:20151110120113j:image

 

 

 はい、たったこれだけです!広告も同じように埋め込むことができます。

 あまり地図とか載せてるブログを見かけないので、この記事を読んでくれたそこのブロガーさんは是非Googleマップを載せてみてください!