Google Adsense のレスポンシブ広告ユニットを横長用、縦長用、正方形用と指定する

Google Adsense のレスポンシブ広告は便利だけど、意図しない方向にびょーんと伸びる!
かといってサイズ指定すると、スマホから見るときに困るし…どうすんだこれっていうときに、
縦長、横長、正方形と、指定できるコードがあったのでメモ

レスポンシブの広告ソース

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- レスポンシブ -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8791350322176637"
     data-ad-slot="9707380902"
     data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

これの、
data-ad-format=”auto”
の部分を差し替えるだけでOK

rectangle (正方形っぽいやつ)
vertical (縦長)
horizontal (横長)
カンマで区切って組み合わせた値(”rectangle, horizontal” など)

例)正方形っぽいやつ data-ad-format=”rectangle”

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- レスポンシブ -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8791350322176637"
     data-ad-slot="9707380902"
     data-ad-format="rectangle"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>




例)縦長 data-ad-format=”vertical”

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- レスポンシブ -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8791350322176637"
     data-ad-slot="9707380902"
     data-ad-format="vertical"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>




例)横長 data-ad-format=”horizontal”

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- レスポンシブ -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8791350322176637"
     data-ad-slot="9707380902"
     data-ad-format="horizontal"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>




例)正方形・横長 data-ad-format=”rectangle, horizontal”

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- レスポンシブ -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8791350322176637"
     data-ad-slot="9707380902"
     data-ad-format="rectangle, horizontal"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>




公式の詳細な案内はここ。

現在のレスポンシブ広告コードではご希望どおりの広告ユニットを作成できていない場合は、レスポンシブ サイトの要件を満たすように広告コードを修正してください。次の例に従うと、広告コードを正しく修正することができます。

レスポンシブ広告コードの高度な機能の例
現在のレスポンシブ広告コードではご希望どおりの広告ユニットを作成できない場合は、広告コードを修正して、一般的な形状(横長、縦長、レクタングル)のいずれかを指定して使用するか、または正確な広告ユニットのサイズを CSS で指定して使用することができます。

この機能は、広告コードを修正する十分な技術をお持ちの場合にのみご利用ください。
https://support.google.com/adsense/answer/6307124?hl=ja&ref_topic=1307438

関連記事

ページ上部へ戻る