ブログ作成の備忘録｜モバイルテンプレートの編集：Google Adsenseを記事の上部に挿入する

今日はブログの主旨からは外れて、運用にあたっての備忘録です。同じように迷った人がいるかも？と思いまして。

このブログはBloggerを利用していますので、その中にあるテンプレートを使って書いているのですが、標準のモバイル用テンプレートはGoogle Adsenseが記事の一番下にしか入りません。これを各記事の上部にも入るようにするにはカスタマイズで設定が必要です。

設定するうえで私のような素人には若干わかりにくかったので、備忘録としての記載してみました。

Google Adsenseの広告コードを準備する

既存のものを活用してもいいのですが、試しということもあって作ってみました。
作成方法としてはGoogle Adsenseの画面から新しい広告ユニットを作成し、広告コードを取得します。細かい手順はここでは記載しませんが、下の画面の緑のアンダーライン引いてあるところを進めていけばそれほど難しくなく広告ユニットの作成＆コードの取得ができます。

広告ユニット自体はいろいろ細かくカスタマイズできるようですが、まずは使ってみてから今後研究していくことにしてデフォルトのままとりあえず作成しました。

作成後は一覧リストから広告コードをクリックすれば、取得できます。

HTMLの編集

今回編集にあたって、Googleで検索するといろいろ情報は出てきますが、こちらのサイトを参考に編集しました。ほぼこの通りに進めば迷うことはないと思います。
ただ、1つだけ例外がありまして、一連の手順をみると、広告コードをHTMLに記載する際に「実態参照に書き換える必要があります」との記述があります。
これを機械的に変換してくれるサイトも世の中にはあるので、それを活用して書き換えたうえでHTMLに記述してみました。しかしながらどうもこれがうまくいきません。いろいろ試した結果、結論としてこの書き換えは必要ないことが分かりました。
Google Adsenseで得た広告コードはそのままHTMLにコピペして大丈夫です。その他ネットで探すとみなさんそろって「実態参照に変換」とあるので、以前はその仕様だったのかもしれないですね。

緑の箇所がGoogle Adsenseのコードが入るところです。前後に分かりやすいようにコメント行をいれています

実態参照のところで、悩んでしまいましたが、結果的にはやってみるとそれほど難しくないです。今後はもう少し見栄えをキレイにする方法を考慮したいところですね。