ダブルレクタングル表示、アドセンス規約違反してない?解決方法を掲載!

アドセンスのダブルレクタングル表示、規約違反していないか確認してみましょう。

f:id:cherry-bon2:20170709121126p:plain

記事下にあるアドセンスのダブルレクタングル表示、よく見かけますね。

でも、規約違反しているサイトがありそうです。
今一度、自分のサイトを見直してみましょう。

何が規約違反なのか

support.google.com

AdSense 広告コードの修正については上記のページに書いてあります。

その中に、こんな内容があるのです…。

display:none などを使用して広告ユニットを隠す
(ただし、レスポンシブ広告ユニットを実装している場合を除く)

レスポンシブでスマホ表示する場合って、ダブルレクタングルだった広告を1個に変更する人が多いじゃないですか。

わかりやすく説明すると、以下イメージ左側のように、2つレクタングル広告が並んでいる状態が「ダブルレクタングル」です。

これを、タブレットやスマホなど画面サイズの小さい端末から閲覧した場合、右側のように1個で見せる手法を取っているサイトがありますねって言うお話です。

f:id:cherry-bon2:20190901153327p:plain

この方法として「display:none」を使おうって書かれているページが多いんですが、この規約について触れているページは少ないのです。

だから単純にサイズ固定の広告を2つ貼った上で「display:none」してる人、いますよね…。

これやったら規約違反なので注意です!!

解決方法とは

ちゃんと規約に(ただし、レスポンシブ広告ユニットを実装している場合を除く)と書いてます。

display:noneするならレスポンシブ広告ユニット使おうぜ!と言うことですね(`・ω・´)

もう一度。レスポンシブ広告ユニット貼りましょう。

そんな感じなのですが、どうすれば良いのか分からないって方のために解決方法を書き残しておきたいと思います。

解決方法その1:レスポンシブ広告1個にする

そもそもダブルレクタングルとか止めて、レスポンシブ広告1個だけにしちゃえって話です。

バナー大きい方が単価高いって話もありますし(実際は大きさ云々より表示されるバナーのジャンルによるんじゃないかなぁ…とも思いますが、よくわからんです)、どうしてもダブルレクタングルにしたい!ってこだわりがなければこれでも良いんじゃないかなって思います。


はてなブログに設定する際は「デザイン>記事>記事下」にレスポンシブ広告ユニットのコードを貼るだけで解決します。簡単ですね。

解決方法その2:Googleが提供している方法に則ってコードを書く

やっぱりダブルレクタングルみたいな表示が良い…って方は、Googleさんが以下のページに解決方法を載せてくれていますのでどうぞ!

support.google.com

…。

……。

なるほどわからんって方のために、代わりにコード書きました。

注: この記事で説明されている例は、AdSense 広告コードの許可されている変更方法です。こうした方法でレスポンシブ広告コードを修正した場合、AdSense プログラム ポリシーに違反することはありません。

ってGoogleさんが言ってる方法に則って書いてます。安心のコードです(`・ω・´)

見本のコード書いたよ


はてなブログに設定する際は「デザイン>記事>記事下」です。

<!-- ダブルレクタングル設定 ここから -->
<style type="text/css">
.adslot_1 { display:inline-block; width: 336px; height: 280px; }
.adslot_2 { display:inline-block; width: 336px; height: 280px; }
.ads { text-align: center; }
@media (max-width:1200px) { .adslot_2 { display: none; } }
</style>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<div class="ads">
<ins class="adsbygoogle adslot_1"
   data-ad-client="ca-pub-XXXXXXX11XXX9"
   data-ad-slot="8XXXXX1"></ins>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
<ins class="adsbygoogle adslot_2"
   data-ad-client="ca-pub-XXXXXXX11XXX9"
   data-ad-slot="8XXXXX1"></ins>
</div>
<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
<!-- ダブルレクタングル設定 ここまで -->

「ca-pub-XXXXXXX11XXX9」をご自分のサイト運営者 ID で2箇所置き換えてください。
「8XXXXX1」をご自分の広告ユニット ID で2箇所置き換えてください。

IDの確認が出来るところは、管理画面でレスポンシブ広告ユニットを作ったあと、コードを取得するボタンをクリックした際に出てくるコードの中に記載されています。
そこから以下2点抜き取ってください。
・「data-ad-client="ここにサイト運営者 ID"」
・「data-ad-slot="ここに広告ユニット ID"」
AdSense管理画面はスクショ載せられないので、わかりにくいですが文字による説明でご了承ください。

何度も言うけどレスポンシブ広告のユニットID使ってね!

ちなみに@media (max-width:1200px)の部分は、横幅1200px以下のデバイスで閲覧された場合、広告を1個の表示にするよって制御が入ってます。
制御する横幅を変えたい方は、ピクセルサイズも修正してくださいね。

その他デザインの微調整を行いたい場合は、ご自身の責任で適宜行ってくださいませ。

おわりに

そんなこんなで、規約違反させちゃいそうなページが多かったのでこんな記事になりました。
何かしら参考になりましたら幸いです。

ではでは('ω')ノシ