その後、レイアウトからガジェットをクリックして、広告を表示したい場所に移動します。
しかし、この方法でアドセンスを設置すると、タイトルの下に表示することができません。
今回は、HTMLを編集して表示させたので、そのときの手順や、注意することを記録します。
HTMLを編集する場合は、念のためバックアップをとっておきます。バックアップ方法がわからない場合は、テンプレートのバックアップを参考にしてください。
アドセンス広告を設置する前の準備
ガジェットのHTML/JavaScriptにアドセンス広告コードを貼り付ける場合とは異なり、HTMLに直接追加する場合は、コードをエンティティ化（実態参照化）する必要があります。変換するのは、「<」と「>」と「"」の３種類でそれぞれ下記のように書き換えます。
< を < > を > " を "１つずつ書き換えるのは非常に面倒なので、変換ツールを使用させてもらいます。
広告コードをコピーしたら、HTML2TEXTの元の文章の部分にペーストして、「上から下へ変換」ボタンをクリックします。
すると、下に変換されたコードが表示されるので、それをコピーしてHTMLに貼り付けます。
コードを貼り付ける場所は、表示させる場所によって変わります。
記事タイトルの下にアドセンスを表示する方法
テンプレートからHTMLの編集をクリックします。
div class='post-header-line-1シンプルテンプレートでは、2つ見つけることができるので、2個目の下に変換したコードを貼り付けます。
貼り付けたら、テンプレートを保存ボタンをクリックして完成です。
これで、記事タイトルの下に表示されるようになりますが、トップページに表示したくない場合は、
<b:if cond="data:blog.pageType == "item""> ここに変換したコード </b:if>のように変換したコードを挟みます。
これで、個別ページにのみ広告が表示されるようになります。
検索の方法
テンプレートを編集の枠内で、どこでもいいので一度クリックして、Ctrlキー+Fを押すと検索窓が開くので、そこに検索したい文字を入力もしくは貼り付けます。
記事の下にアドセンスを表示する方法
記事タイトルの下にアドセンスを表示する方法と同様に、テンプレートからHTMLの編集をクリックし、下記の記述を探します。data:post.bodyシンプルテンプレートでは、3つ見つけることができるので、2個目の下に変換したコードを貼り付けます。
貼り付けたら、テンプレートを保存ボタンをクリックして完成です。
個別ページの記事下のみ表示させる場合は、上記と同じように「if」で挟みます。
タイトルや記事の下に設置するときの注意点
例えば、すでに「ガジェットを追加」でAdSenseを1つ設置して、HTML/JavaScriptで2つ設置していた場合、この時点で合計3つの広告が表示されることになります。通常、Bloggerでは、4つ目以降の広告は白い空白となって、広告が表示されないように自動的に制御されます。
しかし、上記手順で記事タイトルの下と記事の下にアドセンスを追加すると、元々設置していた3つと追加した2つで合計5つ表示されてしまいます。
理由はわかりませんが、この場合自動的に制御されず、AdSenseプログラムポリシーに違反することになりかねません。
また、広告（スポンサーリンク）と記入するか、スペースやラインを入れるなどして、広告であるということをわかるようにしておいたほうが無難です。
広告表示位置の修正
広告が思っていた高さに表示されない場合や、少し右に寄せたい場合など、位置を修正する方法です。<div style="margin : 10px 0px 20px 40px"> ここに変換した広告コード </div>上記のようにマージンで調整します。
左から、上、右、下、左からの距離です。自分のブログデザインに合わせて調節します。
スポンサーリンク
