また旅

日々のこと、画面の中でのこと (今はIDCFクラウド、KUSANAGI、WordPress、Vagrant及びCodeIgniter).

WordPress

STINGER Plus+でPCのAdSense広告を横に並べる一番簡単な方法

2016/06/10

テーマをSTINGER7から、STINGER Plus+に変更させて頂きました。いつもありがとうございます。

変更したついでにPC表示時のAdSenseの広告を2つにこっそり増やして、横に並べてみました。

正直、私、HTMLやCSSの知識はさほど有りませんので、やった~、とりあえず横に並んだ~、という内容であることをご承知おき下さい。

 

なお、簡単とは言ってもテーマファイル single.php は修正します。子テーマをお使いの場合は、親テーマフォルダから single.php をコピーしてください。

それでは管理画面の外観のテーマの編集でsingle.phpを開いて下さい。念のため中身を適当なエディター等にコピペしとくことをおすすめします。で、あとは「広告枠」の箇所を下のに書き換えたら、このページの下の方の通り一応並んで表示されます。

インデントは削りましたので適当に付けてください。もちろん、修正したファイルをFTP等でアップロードしてもOKです。

ファイルの修正をミスると投稿表示のページが真っ白になるかもです。その場合は最初からやり直して見てください。

レスポンシブ広告をお使いの場合は、style="float...をstyle="width: 336px; height: 280px; float... と変更して下さい。(2016.6.10追記)

 

<!-- 広告枠 -->
<?php if ( st_is_mobile() ) { //スマホの場合 ?>
<div class="adbox">
    <?php get_template_part( 'ad' ); //アドセンス読み込み ?>
    <div class="adsbygoogle" style="padding-top:10px;">
        <?php get_template_part( 'st-smartad' ); //スマホ用広告読み込み ?>
    </div>
</div>
<?php } else { //PCの場合 ?>
<div class="adbox clearfix" style="margin: 0 -20px;">
    <div style="float: left;">
        <?php get_template_part( 'ad' ); //アドセンス読み込み ?>
    </div>
    <div style="float: right;">
        <?php get_template_part( 'ad' ); //アドセンス読み込み ?>
    </div>
</div>
<?php } ?>
<!-- /広告枠 -->

 

-WordPress