(cache) はてなブログで【最後の見出し前】に広告を自動挿入する方法

おかげさまでたくさんのアクセスをいただいた昨日の記事。
アクセスも多かったので、短時間で色々試させていただきました（笑）

んで、その流れで広告配置関係のサイトを巡っていたらこんなサイトを発見。

クリック率を劇的に上げるアドセンス広告の配置【ＰＣ/スマホ】

直球ど真ん中の一本釣りタイトルが逆に潔いですよねｗ

とまじぃ的フォーメーションに近いものを感じまして

PC配置はよくあるダブルレクタングル配置

これは特に目新しさはなかったのですが、私の目を引いたのはスマホ配置の方

f:id:tomag:20160627065033p:plain:w300

いわゆる「記事内広告3連発」系配置ですね。

現とまじぃフォーメーションと違うのは中間広告の位置。

とまじぃ配置は「ちょうど真ん中の見出しの上」

このサイトの中間広告は「あとがきの前」

当ブログ的には理にかなった配置かも？

当ブログの場合、「記事下広告」が全体のクリックの大部分をを占めている状況。 f:id:tomag:20160627065755p:plain

はっきり言って他の広告は「飾り」みたいな物でございます（笑）

そして以前のこの記事にて

www.toma-g.net

「まとめ」前で結構な率の方が離脱している事もわかっております。

まとめ前に記事中広告を置くってのは、意外に理にかなってる気がするんですよね。

おまけに「気分的に盛り上がってる記事のど真ん中」に水を差す感じでもないんで誤クリックも避けられそうですし♪

最終見出しのスクリプトを探してみたものの。

一個目見出し上

<script>// <![CDATA[
addEventListener("DOMContentLoaded", function() {
var $target = $('.entry-content > h3');
$target.eq(0).before($('.insentence-adsense'));
}, false);
// ]]></script>
<div class="insentence-adsense">
<p>スポンサードリンク</p>
<!--ここに自分のアドセンスのコード-->
<p> </p>
</div>

中間見出し上

<script>// <![CDATA[
addEventListener("DOMContentLoaded", function() {
    var $target = $('.entry-content > h3,h4,h5');
    $target.eq(Math.floor($target.size() / 2)).before($('.insentence-adsense'));
}, false);
// ]]></script>
<div class="insentence-adsense">
  <p>広告</p>
  <!--ここに自分のアドセンスのコード-->
  <p> </p>
</div>

この二種類しかみつかりません。

改造したいけどJavascriptとか全然わからないしなぁ・・・。

適当にいじったらどうにかなりました。

実は上記の2つのスクリプト。ほとんど同じ構成なことにお気づきでしょうか？

違う部分はこの部分だけなんですよね。

f:id:tomag:20160627070855p:plain

なんかよくわかりませんがたぶん$target.sizeってのを2で割って中間の位置を割り出してるっぽいんでここをいじってやればどうにかなるんじゃねぇ？的なノリです（適当

うーむ！１引いたらいいんじゃねぇ？

f:id:tomag:20160627071714p:plain

その結果・・・。

f:id:tomag:20160627071911p:plain

無事にあとがきの上下に配置できたようです。

よく考えたら・・。

見出しが１０個あった場合は１０個目の見出しの上に入れるわけなんで、１引かなくてもいいんじゃないか？とか思うんですが、上手く行ったので良しとしましょう（笑）

最後の見出し前広告のタグはこちら

<script>// <![CDATA[
addEventListener("DOMContentLoaded", function() {
    var $target = $('.entry-content > h3,h4,h5');
    $target.eq(Math.floor($target.size() -1)).before($('.insentence-adsense'));
}, false);
// ]]></script>
<div class="insentence-adsense">
  <p>広告</p>
  <!--ここに自分のアドセンスのコード-->
  <p> </p>
</div>