ライティングワードプレス行政書士のホームページ行政書士開業ブログ

グーグルマップを埋め込んでホームページやブログを華やかにしよう

上質なコンテンツを書き上げるにあたって、もちろん一番重要なのはその内容(文言)ですが、それと同時に見た目をよくする努力も必要です。

同じ文章であれば見た目がいいほうにアクセスが集まるのは当然でしょう。そしてアクセスが集まればグーグルもより上位に表示させるようになるのです。

 

アイコン ペン最初に少しそれますが、作文とウェブライティングの違いは、その”見ようとする意欲”です。

作文はわざわざあなたの作った文章を見ようと思って手に取るところまでその意欲があるのに対して、ウェブライティングは「なんとなく検索エンジンでサーフィンしてた人」が対象になるからです。

そのため作文よりもウェブライディングのほうが見た目の重要性は高くなります。

 

見た目の良しあしの是非については突き詰めると面倒くさいことになりますから割愛しますが、今回はあなたのホームページの記事にグーグルマップを挿入する方法をわかりやすく紹介します。

 

グーグルマップをホームページ・ブログに取り込む

グーグルマップを開く

まずはグーグルマップを開きましょう。すると下のような画面になります。

canvas2

するとこのような画面になりますので左上の検索の小窓に好きなところを打ち込みます。

 

ここでは、たとえば東京都港区○○1-2-3のように指定して打ち込んでも構いませんし、ある程度アバウトでも構いません。

例えば今回は港区西麻布で打ち込みますが、そうすると港区西麻布の地域をピンク色で表示されます。

 

canvas2

このようになります。では、この地図を実際に埋め込んでみましょう。

 

右下のコントロールパネルを開く

canvas3

 

右下に赤枠で囲いましたが、ここをクリックしてください。

するとこのような小窓があらわれます。

canvas4

 

ここのなかの”地図を共有または埋め込み”をクリックします。

canvas5

さらにその中で”地図を埋め込む”をクリックしてください。するとこのように

<iframe・・・

ではじまるコードがでます。これを埋め込みます。

 

テキストモードで打ち込む

右クリックでコードをコピペしたら、それをあなたのブログやホームページにペーストしますが、一般的にはビジュアルモードで執筆することが多いでしょうからまずはこれをテキストモードにしましょう。

ワードプレスであれば、赤枠のところをクリックしてください。

canvas7

これはhtmlモードといって、パソコンの言葉で直接命令するやり方です。ブログによってはテキストモードのほかにhtmlモードなどの呼び方もあります。

アメブロでもFC2ブログでもシーサーブログでも埋め込みできます。

すると、実際の画面ではグーグルマップが埋め込まれて表示されています。確認してみてください。

 

 スマホでの表示を最適化する

しかし、この状態ですと、スマホで見た時に地図が大きすぎて横が途切れてしまいます。

canvas⑩

 

現在のスマホのシェアを考えればスマホユーザーはSEO的にも絶対に無視はできません。そのためここを最適化します。

少し前に戻って、グーグルマップでコピペしたデータを見てください。

canvas11

ここの部分を変更します。

今は難しくは考えずに、とりあえず

width=”100%” height=”280″

に変更してください。するとスマホでも以下にように表示されます。

canvas12

 

このようにすればスマホでもどのデバイスでもプログラムで勝手に最適化してくれますから便利です。

 

アイコン チェック行政書士のホームページで一番地図を使うのは、まずは事務所所在地でしょう。

さらに申請窓口のインフォメーションだったり、業務日誌にも埋め込むことで親近感が出てきます。何よりも”見やすい”というのはサイトにとっては最高のアドバンテージです。

行政書士といえば法律職ではありますが、開業をすれば、同時にどのように伝えるかを考えることも重要になってきます。是非参考にしてみてください。

 

 


開業やウェブ集客のご相談はフォーラムへ




↓”いいね”をお願いします!↓

監修

行政書士として年間300件以上の許認可・民事案件の依頼を受ける。 士業向けのコンテンツSEOでの集客のコンサルタントも務める。
行政書士 前場亮事務所
106-0031 東京都港区赤坂9-1-7 赤坂レジデンシャル534
tel 03-6418-1075(許認可)

LINEで送る