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

ゆとりずむ

東京で働く意識低い系ITコンサル(見習)。金融、時事、節約、会計等々のネタを呟きます。

MENU

指定タグを付けたページにAdsense広告が表示しないスクリプトを書いてみた

ネット・IT


こんにちは、らくからちゃです。

何やらGoogle Adsense広告を利用している人の中から、Adsense広告の停止措置を受けた人が続出しているようです。わたしが普段確認しているページだけでも

わーお。なんだかはてなブロガーの見本市が出来そうだ。はてなブログのトピックスにも入ったようですね。

さてGoogleAdsenseでは、規約によって『こんなページに広告載せちゃダメよ〜』ということがルールとして決まっています。今回は、Google Analyticsのスクリーンショットをアップロードしたことが原因?という説があるようですが、そんな規約あったかなあと思い読みなおしてみると、『この部分が該当したのでは?』という部分がこちら。

報酬プログラムを提供するサイト(「報酬提供」サイト)

ポリシーについて

「報酬提供」サイトとは、広告のクリックやウェブ サーフィン、メールの購読といった作業を行ったユーザーに対して支払いや報酬を約束するサイトのことです。このようなページへの Google 広告の掲載は、無効な表示回数クリックの発生につながることがあるため、禁止されています。同様に、報酬を提供するサービスにアクセスを誘導したり、そうしたサービスを紹介したりすることを主な目的とするサイトでは、広告掲載が許可されません。

禁止コンテンツ - AdSense ヘルプ

 うーん。やっぱり、何故Google Analyticsのスクリーンショットがダメなのかはよく分かりませんね(笑)。とにかく、Googleさんがご機嫌を損ねているというのであれば、そのページに広告を載せることは控えたほうが良さそうです。

f:id:lacucaracha:20150822100026j:plain

でも広告つけたいじゃん!

 はてなブログにGoogle Adsenseの広告を出している人たちって、基本的に全てのページに自動的に広告が挿入されるように、デザインをカスタマイズしていることが多いんですね。わたしも、こちらの記事でご紹介いたしましたが、自動的に広告を表示しているように設定しています。

別に、えっちぃ記事やバイオレンスな記事を書くことに興味は有りませんが、何故か『お酒』がNG項目に入っているんですよね。そこでわたしは、『特定の記事だけAdsense広告が表示されないよう』デザインに細工をしています。参考にしたのはこちら。

hapilaki.hateblo.jp


 ものすごくざっくり説明すると、

  • 特定のURLの時だけ発動するJavaScriptを用意。
  • 同Scriptが有効になった際には、GoogleAdsenseの命令を無効化する。

という感じです。便利に使わせて頂いていました。

タグ一つで広告オンオフできたら楽じゃない?

ひとつ不満がありました。それは、『対象となるページが増えるたび、リストに追加しなければならない』という点。しかもそれが、PCサイト版とスマホ版の2箇所修正しなければならないので、今は数が少ないのでいいのですが、将来的に増えてきた時を考えると結構面倒くさい(^_^;)

というわけで、ちょっと書きなおして見ましたヽ(=´▽`=)ノ

まずはハピラキさんのページを見て、必要な設定をしておいてください。そして最後に、『6.追加するJavaScriptコード』の部分だけ、下記に置き換えます。PCの場合と、スマホの場合で、コードが違いますので注意してください。

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

これで、記事に『広告不要』というタグを付けた時だけ、Adsense広告が表示されないようになります。

種明かし

『はてなブログ』では、PC版の場合、記事のカテゴリを示す情報として、property属性がarticle:tagと指定されたmetaタグに、contentという属性で『タグ』が示されます。スマホ版の場合、bodyタグの中のclass属性の中に、"category-タグ名"の形式で、タグが記載されます。

ですので、PC版の場合上記のタグを探し出し、contentが『広告不要』がないかを確認する。スマホ版の場合、ID指定でタグを抜き出し、"category-タグ名"の形式で要素が存在しないか確認する。そして、それぞれ『該当タグがある』と判断された場合、adsense広告を無効にするように置き換える。というからくりになります。

ひとつ、注意して欲しいのは、スマホ版の場合完全にタグ名と一致するかではなく、前方一致で判断することになるのでnoAdsTagを『広告不要』にした場合、

  1. 広告不要
  2. 広告不要2
  3. これは広告不要

の3つのパターンがあったとして、1・2のタグは『広告不要』として処理されます。

ちなみにサンプルはこんな感じ。

タグは、必要に応じて書き換えて頂いてOKですが、複数種類には対応していません。必要な人がいれば、ご連絡いたければそのうちやるかも・・・。普段、javascriptなんて書かないので、変なところがあったらご指摘ください♪

ちなみに、『はてなブログ』限定です。

ではでは、誰かのお役に立てば幸いです。