とまじぃさんち

Without haste, but without rest.

【はてなブログ】Adsenseの自動広告を特定カテゴリで非表示にする方法

Google Adsenseの「自動広告」がリリースされてはや一週間。

挿入位置がけっこうフリーダムだったりとか改善点は腐るほどあるのですが、意外に安定した収益を生んでくれるので愛用しはじめちゃってる僕です(笑)

ただこの「自動広告」。

とにかく「隙あらばぶっこんで来る」ので、記事のデザインであるとかアフィリエイト的な戦略とかを完全に無視してガンガン入れてきます。

適当に書いた雑記であるとか、PV増やしてAdsenseでウハウハ系の記事であれば問題ないのですが、「もろアフィ系記事」なんかの場合だと「アフィリンクの真上に邪魔するかのようにAdSenseリンク」なんて事も結構あったりするわけです。

ということで今回は「特定のカテゴリで『自動広告を非表示』にする方法」の解説です。

自動広告は<head>内じゃなくてもOK

Google さんで自動広告を設置しようとすると「head内に設置してね」的な事が書いてあるので、大半の皆様は詳細設定内の「head内に要素を追加」の部分に「自動広告のタグ」を記述していると思います。

ただ、実際このコードはただのjavascriptのコードなのでhead内じゃなくても動くんですねぇ。

もちろん「ページ全体の構成を鑑みて広告を差し込むスクリプト」ですから、「できるだけ最初の方」にある方がよいのですが、別にhead内じゃなくてもOKなんです。

といういことでぶっちゃけ「タイトル下」でも問題なく動いてくれます。

f:id:tomag:20180301202351p:plain

あとは先人のお世話になるだけです

head内だと色々と複雑な処理をする必要がありますが、「タイトル下」であれば先人の方たちが開発された「特定カテゴリでAdsenseを非表示」のスクリプトが使用可能。

一般的なAdsenseのコードと「自動広告」のスクリプトは幾分違いがあるので、多少手順に違いはありますがそこまで大変な話ではありませんのでざっくりと説明していきます。

参考にさせていただいたのはこちらの記事

www.yutorism.jp

一般的なAdsenseのコードの場合「コメント部分を最下部に移動&コード上部に非表示スクリプトを追加」という形で実現できます。

実はこれ「非表示スクリプトとコメントで挟まれた部分を『非表示処理』している」スクリプトなんですねぇ。

で!!

自動広告のスクリプトを見てみると

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({
          google_ad_client: "ca-pub-00000000000",
          enable_page_level_ads: true
     });
</script>

最下部に移動すべきコメント部分がありません・・・・・。

でも大丈夫!なければ勝手に追加すれば良いのです。

ということで、説明するよりも「全部入りのスクリプト」を書いちゃった方が早いですね

PCの場合

<script>
/*
* AdSense Filter v1.0.0
* Date: 2014-12-10
* Copyright (c) 2014 http://hapilaki.hateblo.jp/
* Released under the MIT license:
* http://opensource.org/licenses/mit-license.php
*/
noAdsTag="広告不要"; //広告を設置しないタグを指定
var pageTags=document.getElementsByTagName("meta");
function adsFilter(){
for(var i=0;i<pageTags.length;i++){
if( ("article:tag"==pageTags[i].getAttribute("property")) && (noAdsTag == pageTags[i].getAttribute("content") ) ){
document.write('<!--');
break;
}
}
}
adsFilter();
</script>


<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({
          google_ad_client: "ca-pub-00000000000",
          enable_page_level_ads: true
     });
</script>

<!-- 自動広告 -->

要は「自動広告スクリプトの上部」に「非表示用スクリプト」を追記。

そして「自動広告スクリプトの下部」に適当なコメント (今回の場合は<!--自動広告-->)という部分です。

スマホの場合

<script>
/*
* AdSense Filter v1.0.0
* Date: 2014-12-10
* Copyright (c) 2014 http://hapilaki.hateblo.jp/
* Released under the MIT license:
* http://opensource.org/licenses/mit-license.php
*/
noAdsTag="広告不要"; //広告を設置しないタグを指定
var pageTag=document.getElementById("body");
function adsFilter(){
if(pageTag.getAttribute("class").indexOf("category-"+noAdsTag)!=-1){
document.write('<!--');
}
}
adsFilter();
</script>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({
          google_ad_client: "ca-pub-00000000",
          enable_page_level_ads: true
     });
</script>

<!-- 自動広告 -->

こんな感じです。

あとは「広告を表示したくない記事」に「広告不要」というカテゴリを追加してあげればOKです。

当ブログの場合この記事が「広告不要」カテゴリになっていますので、広告が非表示になっているのを確認してみてください。

www.toma-g.net

まとめ

そんな感じで「どこにでも空気読まないでぶっこんで来るやつ」なので、使いどころに困っていた「自動広告」ですが、このスクリプトを使用することによって、ある程度は「出したくない広告」を制御できるかと思います。

便利なスクリプトを開発してくださったはてなの諸先輩方に敬意を表しつつ、自動広告の恩恵にあずからさせていただきましょうねぇ~♪

わたくしあまり説明が上手ではないので、この記事で要点が伝わならないかもしれません。もしわからないことがありましたら Twitterあたりで声かけてみてください。わかる範囲でお答えします。

twitter.com