38歳無職 5社目の転職活動奮闘記 とその後

まさか会社が倒産するなんて。。。自分は今後どう生きていきたいのか?38歳で無職になった、その後の人生について

【スポンサーリンク】

スマホからはてなブログにGoogleマップを埋め込む方法

 

f:id:nodame79:20190309132146j:image

「スマホからはてなブログにグーグルマップを埋め込みたい!」

本記事では、簡単にできるGoogleマップをブログに埋め込む方法をご紹介します。

 

こんにちは、のだめです。みなさんブログを書く時は、パソコン派ですか?それともスマホ派ですか??

 

わたしの場合、スマホを使用してブログを書くことがほとんどです。スマホは、場所を選ばず何処でも記事が書けてしまう点がすごく魅力的だと思っています。

 

ブログの更新は、パソコンがなくても問題なくできます。大変そうなGoogleマップの埋め込みも、スマホから簡単に出来てしまいます。

 

本記事が、スマホでブログを書いている方の参考になれば幸いです。ちなみにこの記事もスマホから書いています。

【スポンサーリンク】

 

はてなブログにスマホからGoogleマップを埋め込む方法

ブログの更新は、スマホで出来ないことはほとんど無いんではないか?と思ってしまうほどスマホは使いやすいものになっています。

 

スマホからでも、とっても簡単にGoogleマップを埋め込むことも可能になっています。

 

順番に説明していきます。

①Googleで行きたい場所を検索

 まずは、普通に検索をします。f:id:nodame79:20190309135330j:image

②画面下にある、共有ボタンをクリック

画面下に、□に↑のついたボタンをクリックして下さい。ちなみにこのボタンは、共有ボタンと言います。

f:id:nodame79:20190309123050j:image

③デスクトップ用サイトを表示をクリック

今見ている画面は、スマホ用のサイトなのでデスクトップ用のサイトに切り替えます。

f:id:nodame79:20190309122447j:image

④画面右上の地図をクリック

画面がデスクトップ用のサイトに切り替わりましす。そしたら、画面右上に出ている地図をクリックします。

f:id:nodame79:20190309122431j:image

⑤共有ボタンをクリック

画面右下に、矢印が2方向に向かっている共有ボタンをクリックします。

f:id:nodame79:20190309122416j:image

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

地図を埋め込むという表示が出てくるので、それを選択します。

f:id:nodame79:20190309122347j:image

⑦HTMLをコピーします

地図のHTMLが表示されます。表示されたHTMLをコピーします。

f:id:nodame79:20190309122333j:image

⑧はてなブログに張り付けます。

はてなブログに移動し、先程コピーしたHTMLコードを張り付けます。

HTML張り付けボタンをクリック

f:id:nodame79:20190309130850j:image

⑨完成!

無事にGoogleマップが埋め込まれました。

⚠︎Googleマップのサイズを変更したい時

このままですと、地図のサイズが少し大きすぎます。スマホの画面いっぱいにGoogleマップが表示されてしまっているので少し小さくしたいと思います。

サイズ変更も、スマホから簡単に出来ちゃいます。

  • コードを張り付ける際に、HTML張り付けボタンではなく、ペーストボタンでコードを貼ります。

f:id:nodame79:20190309125611j:image

すると、HTMLコードがそのまま張り付けられます。

f:id:nodame79:20190309122047j:image

  • サイズを変更するには、width="600" height="450"この数字を変更します。

試しに、高さを150に変更してみます。

450を150に変更します。

f:id:nodame79:20190309130546j:image

  • 変更したHTMLをカット

f:id:nodame79:20190311215440j:image

  • HTML張り付けボタンをクリック

f:id:nodame79:20190309130850j:image

↓サイズを変更した地図が表示されました。

以上の手順でGoogleマップの埋め込みは、無事に完了です。

とっても簡単に出来ちゃいました。

まとめ

さいごに、スマホからはてなブログへGoogleマップを埋め込む方法をまとめます。

  1. Googleで行きたい場所を検索
  2. 画面下にある、共有ボタンをクリック
  3. デスクトップ用サイトを表示をクリック
  4. 画面右上の地図をクリック
  5. 共有ボタンをクリック
  6. 地図を埋め込むをクリック
  7. HTMLをコピーします
  8. はてなブログに張り付けす
スマホからでも簡単に、GoogleMapを埋め込むことは可能です。

本記事が、スマホからブログを書いてる方の参考になればな幸いです。

【スポンサーリンク】  

このブログは「はてなブログ」で運営しています。 はてなブログの方は、読者登録お願いします。