Adsense レスポンシブ広告を収益性の高いレクタングルで表示する方法

2017/6/11

スポンサーリンク

レスポンシブ広告の特徴

レスポンシブ広告とは、表示スペースに合わせて、サイズを自動的に調節して、自由に形を変えて表示してくれる広告のことです。

広告のサイズを気にせずに配置できるのが、レスポンシブ広告の良さですが、自分の意図と違うサイズの広告が表示されてしまうのが難点です。

Adsense 広告では、一般的にレクタングル広告が一番クリック率が高いとされ、レクタングル広告を表示させようと思っている人が多いかと思いますが、

  • 記事スペースでは横長のビッグバナー広告
  • サイドバーでは縦長のスカイスクレーパー広告

が表示されたりします。

レスポンシブ広告であっても、表示させる広告を意図通りに、収益性の高いレクタングル広告だけで表示する方法を紹介します。

広告コードのカスタマイズ

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

レスポンシブ広告の形状指定

デフォルトでは、レスポンシブ広告コードの data-ad-format タグには “auto” という値が設定され、これにより、レスポンシブ広告ユニットでサイズの自動調整が有効になります。data-ad-format の値を

  • “auto”（自動）
  • “rectangle”（レクタングル）
  • “horizontal”（横長）
  • “vertical”（縦長）
  • これらをカンマで区切って組み合わせた値（”rectangle, horizontal” など）

に変更すると、レスポンシブ広告ユニットで一般的な形状（レクタングル、横長、縦長）を設定できます。

AdSenseの広告ユニットの作成で、「自動サイズ レスポンシブ」を選択して広告ユニットを作り、コードを取得します。
レクタングル広告を表示するには、広告コードを下記のように変更します。

7行目の data-ad-format=”auto” → data-ad-format=”rectangle” に変更
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- 自動サイズ レスポンシブ -->
<ins class="adsbygoogle"

     data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"
     data-ad-slot="xxxxxxxxxx"
     data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

これで、形はレクタングル形状で、サイズは表示領域に合わせて自動サイズで、

  • 記事スペース：レクタングル(336×280) or 特大レクタングル(メイン横幅×280サイズ)
  • サイドバー：サイドバー横幅に合わせて、小さいサイズのレクタングル

の広告が配信されます。

【特大レクタングル広告】
メイン横幅いっぱいに、高さ 280px の特大レクタングル広告（レクタングル（大）を横に２つ並べたサイズ）が表示されます。

【小さいサイズのレクタングル広告】
サイドバー横幅に合わせて、250×250 スクエア、200×200 スクエア（小）、180×150 レクタングル（小）などが表示されます。

レクタングル表示にするには

上の方法では、記事スペースは、レクタングルか、特大レクタングルの2種類の広告がランダムに表示されますが、レクタングルに固定したい場合は、下のように広告コード4行目の style タグに、レクタングルの最大横幅（max-width:336px;）を設定します。

style=”display:block;max-width:336px;“

【レクタングルの広告】
横幅 336px のレクタングル（大）の広告のみが表示されるようになりました。

スマートフォンの場合は

パソコンでは「336×280 レクタングル（大）」、スマートフォンでは「300×250 レクタングル」を使用するのが一般的ですが、最近のスマホは画面サイズが大きくなってきているので、iPhone6 以降や Android 端末は殆どがレクタングル（大）でも問題ないサイズとなってます。レスポンシブユニットであれば、

  • 画面サイズが大きいスマホなら「336×280 レクタングル（大）」
  • iPhone5s以前の画面サイズであれば「300×250 レクタングル」

と自動で切り分けをしてくれます。

テーマのレスポンシブデザインと違って、ページを開いた状態で画面を伸び縮みさせても、その動きに応じて広告が変わるというわけではありません。そのページが読み込まれた時点でサイズが決定され、変更されます。

スポンサーリンク