スマホ上部に320×100サイズのアドセンス広告を設置する 【STINGER5】

【STINGER5】のアドセンス広告は、スマートフォンで表示すると300×250サイズが最下部に表示されます。
これだとクリック率が上がらないと思うので、この最下部の広告を削除して、サイト上部に広告を表示するようにします。

【STINGER5】でスマホに320×100サイズの広告を貼り付けると、幅がはみ出してしまいます。
その対策として、CSSスタイルでmargin-left:-10px;と指定し、左に10px寄せるという技を使います。
これを「ネガティブマージン」と言います。

1.phpで分岐させて、PCには非表示でスマホだけ表示させるようにします。

stinger5_child:単一記事の投稿(single.php)の
<!–/ ぱんくず –>の下辺りに記述します。

<!– スマホだけのアドセンス –>
<?php if (is_404()) { ?>
<?php } else { ?>
<?php if(is_mobile()) { //スマホの場合 ?>
<div style=”padding-bottom:10px; margin-left:-10px; text-align: center;>

「アドセンス広告のソースコード」

</div>
<?php } else { //PCの場合 ?>
<?php } ?>
<?php } ?>
<!– /スマホだけのアドセンス –>

スマホに320×100サイズのアドセンス広告を設置する

ぱんくずの下にしっかりと表示されましたね。

2.「スマホだけのアドセンス」のソースコードを削除

アドセンス広告は基本的に1ページ3つまでしか表示できませんので、スマホで最下部に表示されるアドセンスを削除します。

stinger5_child: sidebar.php

「スマホだけのアドセンス」のソースコードを削除します。

<!– スマホだけのアドセンス –>
<?php if (is_404()) { ?>
<?php } else { ?>
<?php if(is_mobile()) { //スマホの場合 ?>
<div style=”padding-top:10px;”>
<?php get_template_part(‘ad’); //アドセンス読み込み ?>
</div>
<?php } else { //PCの場合 ?>
<?php } ?>
<?php } ?>
<!– /スマホだけのアドセンス –>

※「Stinger5のスマホ表示に320×100サイズのアドセンス広告を設置する手順 」のサイトを参考にさせていただきました。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする