かずきち。の日記

サーバサイドエンジニアのつぶやき

はてなブログのサイドバーにバナー広告を追尾型配置(オフセット)して、広告視聴単価をあげよう!

広告の視聴可能時間を上げたい

サイトで広告掲載を行っていますか?
多くのウェブサイトが自サイトに広告掲載を行うことで収益を上げています。

広告視聴単価制は、Google 広告で作成した TrueView 動画広告で使用するデフォルトの入札方式です。ユーザーが動画を視聴するか、Call-to-Action オーバーレイ(CTA)やカード、コンパニオン バナーのクリックなどの動画に対する操作を行ったときに料金が発生します。

つまり、なるべくをユーザーの目に止まらせたほうが広告の単価が上がりやすい傾向になります。
アドセンスのサポートチームでは下記のように追尾型配置を許可しています。

追尾広告につきましては、現在全てのアカウントでご利用いただける仕様となっており、
Google からの許諾は不要となりますのでご安心いただけますと幸いでございます。

なお、追尾広告は特別のユニットではなく、一般的なユニットを CSSJavaScript プラグインなどをご利用いただき、追尾するようご設定いただく必要がございますこと予めご留意いただけますと幸いでございます。

Googleアドセンスサポートチーム

というわけで、CSSJavaScriptで広告を配置してCPCをあげちゃいましょう。
広告を掲載しているサイトでこのようなコードを貼り付けてください。

<!--サイドバー固定-->
<script>
$(window).load(function() {
var sideLast = $(".hatena-module").filter(":last");
var sideLastTop = sideLast.offset().top + 450;
var sideLastWidth = sideLast.width();
var win = $(window);

win.scroll(function(){
if(win.scrollTop() > sideLastTop) {
sideLast.css("position",'fixed');
sideLast.css("top",'20px');
sideLast.css("width",sideLastWidth);
}else{
sideLast.css("position",'relative');
};
});
});
</script>
<<

そうすることで、スクロールを追尾して広告を表示させることができます。
やってることとしてはブリグの最終にあるサイドバーをオフセットしてトップ表示するためのコードです。
デザイン→ヘッダ箇所をいじれば、すぐに実装できますのでぜひ使ってみてください。

[https://www.exotic-world.jp/other/promotion/tsuibigatakoukoku/:embed:cite]
引用:
[https://www.exotic-world.jp/other/promotion/tsuibigatakoukoku/]