アドセンスの初期広告コード〜４日目｜アドセンス日記

アドセンスの初期広告コード〜４日目｜アドセンス日記現在、アドセンスでマネタイズする方法について実験中です。

アドセンスのアカウントが承認され、いよいよ広告の配信が始まりました。そこで、実際に初期設定で貼ったコードを忘備録も兼ねて記載しておくことにします。

ＰＣサイト用のコード

まず、ＰＣサイトには、記事下に 300×250 の広告を２つ横並び（ダブルレクタングル）で、左側にディスプレイ広告のみのタイプを、右側にテキスト広告とディスプレイ広告のタイプを貼りました。

<span style="font-size:80%">スポンサーリンク</span><br/>
<div id="adsense-left">

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- 261231_PC用_左 -->
<ins class="adsbygoogle"
     style="display:inline-block;width:300px;height:250px"
     data-ad-client="ca-pub-xxxxxxxxxxxxxxx"
     data-ad-slot="xxxxxxxxxxxx"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

</div>
<div id="adsense-right">

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- 261231_PC用_右 -->
<ins class="adsbygoogle"
     style="display:inline-block;width:300px;height:250px"
     data-ad-client="ca-pub-xxxxxxxxxxxxxxx"
     data-ad-slot="xxxxxxxxxxxx"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

</div>

ちなみに、アドセンスの広告枠を２つ横並び（ダブルレクタングル）するための CSS は以下の通りです。

#adsense-left {
     float:left;
     padding:0px 5px 0px 0px;
     }
#adsense-right {
     padding:0px 5px 0px 0px;
     }

スマホサイト用のコード

次はスマホサイトです。スマホサイトでは記事下とページ下の２ヶ所にアドセンスの広告枠を設けました。記事下にはディスプレイ広告のタイプを、ページ下にはテキスト広告＋ディスプレイ広告のタイプを貼りました。

レスポンシブの広告を使用しますが、横長のバナーだとスマホで見ると小さくなってしまうので、横長のバナーが表示されないように CSS で調整しておきます。

.responsive-unit{
  max-width: 336px;
}

そして、広告コードを貼り付けますが、下記コードの５行目にあるように「responsive-unit」を忘れずに入れておきます。あとは、バナーが中央に配置されるように centerタグをつけました。

<center><span style="font-size:80%">スポンサーリンク</span><br/>

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- 261231_スマホ用_1 -->
<ins class="adsbygoogle responsive-unit"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxxxxxxxx"
     data-ad-slot="xxxxxxxxxxxx">
     data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

</center>

このようにアドセンスの広告コードを記事下とページ下の２ヶ所に貼り付けたら、作業終了です。最初は空欄しか表示されませんが、そのまま放置しておくと30分も経てば広告が表示されているはずです。