Blogger Labo:【Hello, world!】記事中・記事下のアドセンスの設定方法(コード変換ツール付)

自作テンプレートのリリース情報の補足として、テンプレートの記事中・記事下にアドセンスを設定する方法をまとめておこうと思います。この記事の内容は基本的には当サイトで制作したテンプレートのみに対応していますが、Vaster2など記事中・記事下にアドセンスを配置できるタイプのテンプレートに転用することができます(ただし、クラス名は変更しなければなりません)。


当サイトのテンプレートの記事内にアドセンスを設定する方法


当サイトのテンプレートには、記事中・記事下にアドセンスを設定できる区画を設けてあります。以下のような操作をして、アドセンスコードの設定をしてください。

なお、下記の変換ツールで変換されるコードは当サイト(Blogger Labo)と同様の設定になります。好みに合わない場合はご自身でコードの設定を変更してください。

アドセンスコードをテンプレート用に変換する


・レスポンシブ広告のアドセンスコードを取得する
・下記のコード変換ツールにアドセンスを貼り付けて変換を実行する

ここにアドセンスコードを入力



記事中アドセンス(結果をクリックでコピー)



記事下アドセンス(結果をクリックでコピー)



アドセンスCSS(結果をクリックでコピー)



記事中・記事下のアドセンス貼付欄にコードを貼り付ける


テンプレート編集画面で「アドセンスコードを貼り付ける」で検索すると、貼付欄が3箇所見つかります。

・記事中コードを、記事中アドセンスの貼付欄に貼り付ける
・記事下コードを、記事下アドセンスの貼付欄に貼り付ける(個別記事ページ)
・記事下コードを、記事下アドセンスの貼付欄に貼り付ける(固定記事ページ)

CSSを貼り付ける


編集画面で「/* 記事中アドセンス */」で検索すると、CSSのアドセンス設定が見つかります。

・変換ツールで生成されたCSSコードをコピーする
・CSSのアドセンス設定部分をコピーしたコードで上書きする

ここまですると、上手く設定できると思います。問題があればコメント欄でお知らせください。