【STINGER PLUS+】サイドバーにアドセンスのラージスカイスクレイパーを設置してみた

サイドバーのアドセンスはクリック率が低いという話を聞いたことがあります。
しかし、それとは逆に、収益が上がったという人もいるようです。

ナツキ

いやいや、どっちやねん！

ネット上の意見は鵜呑みにせず、あくまでも参考程度に考えておくべき。
サイトが違えば傾向も変わってくるのは当然のこと。

なので、自分で確かめてみることにします。

サイドバーにアドセンスを設置し、条件分岐でパソコンでは『ラージスカイスクレイパー』、スマホでは『レスポンシブ』が表示されるようしてみました。

ラージスカイスクレイパーはスマホで表示させると規約違反

ラージスカイスクレイパーは、「300×600」という大きいサイズの広告です。
大きいから目立ってクリックされやすい…かもしれません。

「だったら、パソコン・スマホどちらにも表示させよう♪」
なんて考えていると危険です。

スマホでラージスカイスクレイパーを使うと、画面いっぱいに広告が表示されてしまうので、アドセンスの規約違反になってしまいます。

なので、条件分岐でパソコンとスマホでは表示される広告を切り替える必要があるのです。

サイドバーに条件分岐でアドセンスを設置

では、アドセンスを設置していきます。

サイドバー（sidebar.php）にコードを追記

WordPress管理画面で「外観」⇒「テーマの編集」⇒子テーマ「sidebar.php」の編集画面へ。

<div id="side">
	<aside>

		<?php if ( is_active_sidebar( 10 ) ) { ?>
			<div class="side-topad">
				<?php if ( function_exists( 'dynamic_sidebar' ) && dynamic_sidebar( 10 ) ) : else : //サイドバートップのみのウィジェット ?>
				<?php endif; ?>
			</div>

真ん中辺りに上記のコードがあるので、上記でいう3行目に下記のコードを挿入していきます。

<?php if(st_is_mobile()) { //スマホの場合 ?>
	<p class="ad-label">スポンサーリンク</p>
	<div class="ad-box">
		【ここにスマホ用広告コードを挿入】
	</div>
<?php } else { //PCの場合 ?>
	【ここにPC用広告コードを挿入】
<?php } ?>

広告コードは各自で置き換える必要があります。

当ブログの場合、PC用は『ラージスカイスクレイパー』、スマホ用は『レスポンシブ』にしています。
スマホ用広告が必要なかったり、別の広告を表示させたいのであれば、2～5行目を削除、もしくは別の広告に置き換えてください。

アドセンスを記事ごとに非表示にしたい場合は、以下のカスタマイズ記事で対応したコードを記載しているので、あわせて参考にしてください。

スタイルシート（style.css）にコードを追記

続いて、子テーマ「style.css」の編集画面へ。

/* アドセンスのラベル表記 */
.ad-label {
    font-size: 80%;
    color: #333;
    text-align: center;
    margin-bottom: 2px;
}

.ad-box { 
    margin-bottom: 40px;
}

上記のコードを追記してください。

ラベル表記と広告下側の余白を調整しています。
数値は適宜変更してください。

以上で、サイドバーにアドセンスの設置が完了です。