白兎（@shirousagi_memo）です！
ワードプレスでブログを書いていた時に、アドセンスの広告で一番クリックされてる場所が目次上と記事下の2個並びの広告だったんですが、はてなブログに来た時に専用の設置場所が無くて、なんと書く掲載をしてませんでした。
でも、やっと重い腰を上げて設置しましたので簡単に掲載方法とHTMLを記事としてまとめておきます。多分，意外と知らない人も多いと思います。少しでも役に立ってくれると嬉しいです！
ワードプレスだと当たり前のように設置されてるけど、はてなブログは結構設置してないよね？それってワードプレスと違って専用の場所が無いからだよね？なので頑張って説明するよー！
今日、設置する広告はコレ
記事内の目次上と3番目の見出しの上に掲載する為の方法と...！
この記事下に2つ並んだ２BOX広告の設置方法ね。ちょっとだけコツがある。ちなみにPCだと2つ出て来るけど、スマホだと1つになるので安心してね！。
記事内にアドセンス広告を出す方法！
まずはアドセンスの設定だけど①も②も...▼
ディスプレイ広告のレスポンシブで作成して下さいね。
レスポンシブとはどういう意味ですか?
「レスポンシブWebデザイン」とは、PC、タブレット、スマートフォンなど、異なる画面サイズの幅を基準にWebサイト表示を柔軟に調整し、見やすく最適な表示にすることを指します。
スマートフォンサイトを全く別のデータで用意し、表示するやり方もありますが、「レスポンシブWebデザイン」のメリットは１つのファイルでPC・タブレット・スマホなどすべての表示を行うことができることです。テキスト・画像などは共通のものを利用することになりますので、後々の更新や修正といった管理がしやすくなり、PCサイト、スマートフォンサイトで情報が異なるといったことは基本的にはありません
ちょっと専門用語多いかな？
すごーく簡単に言うと、レスポンシブで作成したアドセンス広告はブラウザの幅を自動で読み取ってそれに合った幅で広告を自動掲載してくるという優れもの。良くスマホで縦で見た時と横にした時でサイトの幅が変るよね？あれをレスポンシブという。
HTMLはコレ
<!--目次上にリンクユニット-->
<script>// <![CDATA[
addEventListener("DOMContentLoaded", function() {
var $target = $('.entry-content > ul');
$target.eq(0).before($('.adsense-link'));
}, false);
// ]]></script>＊＊＊ ここに広告コード① ＊＊＊
</div>
<p style=" margin-bottom:10px;"> </p>
<!--3番目の大見出しにレクタングル大-->
<script>// <![CDATA[
addEventListener("DOMContentLoaded", function() {
var $target = $('.entry-content > h3');
$target.eq(2).before($('.adsense-2'));
}, false);
// ]]></script>＊＊＊ ここに広告コード② ＊＊＊
</div>
このHTMLをメモ帳にコピペして
＊＊＊ ここに広告コード① ＊＊＊
＊＊＊ ここに広告コード② ＊＊＊
の部分に自分のアドセンスコードを貼ろう！
難しく考えずにその部分にコードをそのまま貼るだけ！
はてなブログに設置
- はてなブログにログイン
- レフトのデザインをクリック
- スパナマーククリック
- 記事をクリック
- 記事上にコードを貼る
これで完成！＾＾
記事下にアドセンス広告を2個並べる方法
まずはさっきと同じようにアドセンスの管理画面から広告を作成するけど、今回はレスポンシブでは無く（←大事！）今回作成するのが300×250の広告サイズ。種類は同じディスプレイ広告でOK！
- 広告はディスプレイ広告2個
- サイズは300×250を2個作成
- 広告の名前を右と左で分けて置くと効果見やすい
（広告のサイズはココで指定できるからね！）
HTMLはコレ
<p style="text-align:center;">
<span style=" font-size:85%; padding:10px; color:#555">Sponsored Link</span><br />
＊＊＊ ここに広告コード左 ＊＊＊＊＊＊ ここに広告コード右 ＊＊＊
</p>
これだけなんだけど、ちょっと補足！
- 広告コードのサイズ300×250
- 広告左と広告右の間に全角スペース1文字分入れる
- 広告右の「<ins class="adsbygoogle"」の部分を「<ins class="adsbygoogle none-mobile"」に変更する
これだけ！
特に③は何？かと言うとスマホになった時に右の部分を隠すって意味。これでスマホで見た場合は広告が左の部分のみ出る。
...と言う事は成果の確認で絶対左が多くなるので注意ね！
はてなブログに設置
- はてなブログにログイン
- レフトのデザインをクリック
- スパナマーククリック
- 記事をクリック
- 記事下にコードを貼る
以上だね！
記事内広告の場合は記事上で、記事下の2個広告は記事下に入れる。それだけ。後はPCとスマホからの表示を確認してみてね。また300×250サイズの広告はクリック単価が高いとも書いてあったような...？ホントかな。
まとめ
アドセンスは掲載位置によって全然収益が変る。さっきも書いたけどワードプレスだと目次上ってクリックされてたけど、はてなブログってそうでもないかも？と思ったり、ここがクリックされるの？と思ったり。書いてるカテゴリーやユーザー属性でも変化するので色々試して....で、僕にも教えて（笑）。
もしうまく行かない場合はコメント下さいね！個別に解説します。