読者です 読者をやめる 読者になる 読者になる

とまじぃさんち

信じるか信じないかはあなた次第・・・。

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

インターネット インターネット-GoogleAdsense

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

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

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

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

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

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で割って中間の位置を割り出してるっぽいんでここをいじってやればどうにかなるんじゃねぇ?的なノリです(適当

うーむ!1引いたらいいんじゃねぇ?

f:id:tomag:20160627071714p:plain

その結果・・・。

f:id:tomag:20160627071911p:plain

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

よく考えたら・・。

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

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

<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>

注意

一個目見出し上用タグと併用する場合は「insentence-adsense」って部分を「insentence-adsense2」みたいな感じでリネームしないと、動作が衝突して意図しない配置になってしまいますのでご注意を!!

まとめ

$target.sizeの後ろの計算式を変えることで、ある程度思いどおりの位置に見出しを挿入することができるようです。

3で割って前半1/3のあたりの見出し前に入れるとか応用は色々効きそうです。

そこまで細かく配置してもあまり結果はかわらない気もしますが(笑)

ただ・・・この方法には難点がありまして・・・。

手を抜いてあとがきを短めにしちゃうと、一画面内に広告が2つ載ってしまってadsenseのポリシー違反になってしまうこと。

だからこの様にどうでもいい話でまとめの尺を伸ばさないといけませんwwww

そんなわけで、昨日の隠れバズも落ち着いて今日からまた平常営業。

はたしてこの広告配置が吉と出るか凶と出るか・・・お楽しみに♪