記事一覧にアドセンスのインフィード広告を表示する-[stinger plus2]

blog

wordpressのテーマによっては、インフィード広告の挿入用にウィジェットが用意されていたりします。(このブログで使っているテーマcocoonは対応している)

まだ対応していないテーマもありますので、今回は「stinger plus2」について書いていきます。

*子テーマ使用を前提にしています。

*adsenseのインフィード広告用コード取得の方法は割愛させていただきます。
ご参考→ インフィード広告ユニットを作成する

 

.phpテンプレートの修正

記事一覧を表示するテンプレート「itiran-thumbnail-on.php」を修正します。

2行目に以下の記述があるかと思います。

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

 

これを以下のように書き換えます。

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); $count++; ?>
<?php if ( $count == 4 || $count == 8 ) : ?>
<dl class="clearfix">
 //取得したアドセンスコード
</dl>
<?php endif; ?>
<?php endif; ?>

ここでは、3行目の「$count」のところで、4個目と8個目に表示されるようにしていますが、お好みで変更できます。

「dl class=”clearfix”」でアドセンスコードをくくっていますが、これは「stinger plus2」の記事一覧のタグがそうなっているため。

これでアドセンスコードを囲ってやることで、区切り線や隙間がほぼ再現できます。

それでも微調整が必要になる場合がありますが、その時は「class」指定を追加してcssで微調整します。

 

PC用とスマホ用でサムネイルの大きさを変えている場合

この場合は、アドセンスコードを2つ取得して、以下のように条件分岐します。

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); $count++; ?>
<?php if ( $count == 4 || $count == 8 ) : ?>
<?php if(st_is_mobile()) :?>
<dl class="clearfix">
 //スマホ用のアドセンスコード 
</dl>
<?php else: ?>
<dl class="clearfix">
 //PC・タブレット用のアドセンスコード
</dl>
<?php endif; ?>
<?php endif; ?>

条件分岐について「stinger plus2」では

・「st_is_mobile()」を使用した場合、「スマホ」と「PC・タブレット」
・「wp_is_mobile()」を使用した場合、「スマホ・タブレット」と「PC」

という分岐になります。

 

*因みに、「関連記事」の間にインフィード広告を表示させるには以下の記事をご参照。

https://ks-fdripp.tfmwish.comstinger2_infeedkanren/

 

wordpressの管理画面から、function.phpなどの.phpファイルを編集した場合、うまく動作しない時があります。

その際は、ftpソフトなどでいったん該当ファイルをローカルに保存して、そこで編集を行います。

編集した.phpを、ftpソフトなどで再度アップロードする事で正常動作する場合があります。

.phpを編集する際は、サクラエディタ が、エラーが少ないのではないかと思います。

上のエディタで保存する場合は、文字コード「UTF-8」、BOM「チェック無し」がエラーが少ないのでは無いかと思います。

sakuraediter

タイトルとURLをコピーしました