昨日成功した、サイト内にGoogleマップを埋め込んだ過程を更新します。

 

まず、トップページ下段の地図が入りそうな四角い枠。

このソースを探すところから始まりました。

 

ワードプレスを使ったことのある方ならご存じだとは思いますが、固定ページから投稿以外の各ページを編集できます。

しかし、トップページの「ビジュアル」も「テキスト」も編集画面にでていませんでした。

まずここでつまづいてしまったのです。

 

いろいろ調べていくうちに、「外観」→「テーマの編集」から、トップページに反映されていそうなモノを発見。

ひとつひとつ確認してみました。

 

ここで、つまづきその2です。

 

みつからない!!

 

それっぽいものはあるものの、みつけられません。

 

ここで助けていただきました。

 

私の探し方としては、プログラムの羅列を見ていってもわかるはずもないので、枠の横に書いてある日本語を探していたのですが、ここでは日本語の表記はされないそうです。

 

なるほど!

 

では、純粋に枠っぽいモノを探していけば見つかるはず!

 

サイトのソースとテーマ編集のページを隣合わせにして、ようやく見つかりました。

 

あとは枠内に以前から用意だけはしておいたマップコードを入れ込むだけ!

 

ですが…

ここでつまづきその3です。

 

枠内にコードを入れたはずなのに反映されない…

 

コードを入れる場所が違うというのはなんとなくわかってはいたものの、「ここかな?」「こっちかな?」「じゃあここ?」といろいろ試すも失敗。

 

枠内に「”〉」←このような記号は反映されるようにはなったことに希望を見出しましたが、失敗。

 

そして、ここでまた助けていただきました。

 

私は7~8年程前にHTMLの勉強をしていたことがあるのですが、基本ともいえるカタチをすっかり忘れていました。

 

〈○○○○〉〈/○○○○〉

 

これ!このカタチ!

 

簡単に言うと、始まりと終わりということです。

 

枠内に地図コードを埋め込むにも、その枠内で区切ってあげないといけなかったのですね。

 

こうして無事にマップを表示させることができました。

 

結果、自分では何も解決していなかったことに気づきますが…

 

今回の件はとっても勉強になりました。