しょくのこのゆるく空回りな暮らし

HSS型HSPの管理人がゆるい日常の様子をお届けするブログです、ときどき熱血のスイッチが入ります(笑)乗り物と旅行と料理が好きです。

はてなブログで【グーグルマップ】と【ストリートビュー】を埋め込む方法!

f:id:shokuneko:20190225124440j:plain

 

ども【グーグルストリートビュー】が好きなしょくのこ@sokunekoです!

 

 

ブログでお店などを紹介するとき【グーグルマップ】や【ストリートビュー】があると便利ですよね!

 

f:id:shokuneko:20190225125225j:plain

こんな感じのやつです!

 

今回は【グーグルマップ】と【ストリートビュー】をはてなブログに埋め込む方法を紹介します(*'ω'*)

 

 

★【グーグルマップ】の埋め込み方

 

今回は【東京】を例にして紹介します。

 

やり方はとても簡単です!

 

まず、グーグルマップを開きます。

f:id:shokuneko:20190225125721j:plain

検索欄の左側の【三】のボタンをクリックします。

 

f:id:shokuneko:20190225130025j:plain

メニューが開いたら【地図を共有または埋め込む】をクリックします。

 

f:id:shokuneko:20190225130257j:plain

【地図を共有または埋め込む】をクリックするとこんな画面が開きます、ここで【地図を埋め込む】をクリックします。

 

f:id:shokuneko:20190225130601j:plain

HTMLコードというものが表示されるので、こちらをコピーして【はてなブログ】の【HTML編集】画面にコードを張り付ければ完了です(*'ω'*)

 

 

実際にコードを打ち込むとこんな感じになります(*'▽')

 

★【ストリートビュー】の埋め込み方

こちらのやり方も簡単です!

 

f:id:shokuneko:20190225131613j:plain

【ストリートビュー】の画面を開き、目的地名の右側にある【・・・】をクリックし【画像の共有または埋め込む】をクリックします。

 

 

f:id:shokuneko:20190225132044j:plain

【グーグルマップ】のときと同じようにHTMLコードが表示されるので、このコードをコピーして【はてなブログ】の【HTML編集】画面に張り付ければ完了です(*'▽')

 

コードを張るとこんな感じになります!

 

東京駅構内

 

 

すごく簡単なので、ブログで場所を紹介したい方はぜひ参考にしてみてください!

広告