注意!レスポンシブサイズのアドセンス広告コードはそのまま使ってはいけない
グーグルアドセンスをブログに貼るときのサイズは「レスポンシブ」を推奨しています。
(「レクタングル」の336×280サイズか300×250もありですが、基本的には「レスポンシブ」がいいですね)
「レスポンシブ」はユーザーが閲覧している端末がPCなのかスマホなのか、といった端末の画面サイズに合わせたサイズの広告を自動的に選別して表示してくれるので非常に便利です。
ですが、「レスポンシブ」を利用する際、取得したコードをそのまま貼り付けないように注意してください。
広告コードはそのまま利用するな
ブログ内に広告を貼り付けるとき、僕たちは大きな正方形かやや横長の大きな長方形が表示されることを期待しています。
グーグルアドセンスの広告コードを取得する際に「レスポンシブ」を選択するとコードが表示されますが、これをこのまま記事に貼り付けないでください。
そのままのコードでは、僕たちが期待しているタイプの広告サイズだけでなく、やたら横に細長い長方形のタイプが表示されたりして、「そうじゃないねん!」となる事態が生じます。
ですので、その点をコード上で修正する必要があります。
広告コードの修正方法
広告コードは以下の通りに修正してください。
取得したままのコードは以下のとおりです。(一部の箇所は伏せています)
<script async src=”//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js”></script>
<!–ここには自分で設定したコード名がきます –>
<ins class=”adsbygoogle”
style=”display:block”
data-ad-client=”ここには数字の羅列が来ます”
data-ad-slot=”ここには数字の羅列が来ます”
data-ad-format=”auto”></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
この下から4行目の auto の部分を変更します。
これを rectangle に変えてください。
<script async src=”//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js”></script>
<!–ここには自分で設定したコード名がきます –>
<ins class=”adsbygoogle”
style=”display:block”
data-ad-client=”ここには数字の羅列が来ます”
data-ad-slot=”ここには数字の羅列が来ます”
data-ad-format=”rectangle”></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
このようになります。
これで僕たちの期待する、大きな正方形・やや横長の大きな長方形の広告サイズが表示されるようになります。
まとめ
アドセンス広告で報酬を得ていくわけですので、こうしたポイントはできるだけしっかりとおさえておきたいです。
【関連記事】
Googleアドセンス2次審査 ~ブログに広告を貼る~:基本的な広告コードの貼り方はこの記事で。
「AdSense Manager」でグーグルアドセンスを一括表示・管理(動画解説付)