今回は記事一覧の中にアドセンスを挿入する方法です。
なお当記事はstinger plus2に関する記事です。
stinger8の場合は、こちらをご覧ください。
そこまで難しくはなくコピペでできますが、
カスタマイズになるので、子テーマを使用しましょう。
子テーマについてはこちら！
- 国内シェアNo.1の高速サーバーなのでストレスフリー！
- 自動バックアップ機能に標準対応で安心運用可能！
| 気になるポイント！ | キャンペーン中に契約すれば.com等のドメインを永久無料で使えます！ |
|---|
itiran-thumbnail-on.phpを編集する！
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
まずはitiran-thumbnail-on.phpの上部にある上記のコードを消し、
以下のコードに書き換えます。
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); $count++; ?> <?php if($count == 3 or $count == 6 or $count == 9) : ?> <div class="itiran-ad"> <p>スポンサーリンク</p> //ここに広告のコード// </div> <?php endif; ?>
上記の
にアドセンスのコードを記載してください。
オススメの広告ユニットは、
『レスポンシブ』です！
こんな感じになります。
補足
<?php if($count == 3 or $count == 6 or $count == 9) : ?>
上記のコードでは【$count == 3、6、9】という数字が入っていますが、
こちらの【3、6、9】という数字は、
記事一覧の3番目、6番目、9番目に、表示させるという意味です。
そのままでも構いませんが、こちらは好きな数字に変更してください。
また上記の説明では3つ表示させていますが、
アドセンスの数を減らして2つの場合は、以下の様にすればできます。
($count == 3 or $count == 9)
以上で、アドセンスが表示されましたが、
このままですと見た目が悪いので、
スタイルシートで調整します。
style.cssに追記する！
アドセンスと記事のバランスが悪いので、
スタイルシートで調整します。
以下のコードを追記します。
/*--トップ一覧広告--*/
.itiran-ad {
text-align: center;
padding-bottom: 20px;
margin-bottom: 20px;
border-bottom: 1px solid #38b48b;
}
/*--スポンサーリンクの文字--*/
.itiran-ad p {
font-size: 14px;
line-height: 1em;
color: #999;
margin-bottom: 10px;
}
/*--ここまで--*/なお、borderの色等については、
自分のサイトに合うよう調整してください。
これで以下の通りになります。
これでうまく表示されていれば、
完成です！
広告の貼り過ぎにはご注意！
どんなに良質なコンテンツであっても、
広告だらけで、読みにくいブログは嫌厭されてしまいます。
適度な数の広告にすることをこころがけましょうー
コピペも良いですが・・・
カスタマイズ記事はコピペできるものもあり、便利ですが、もし分かりずらかったりする場合は、本などを併せて使用すると、理解度が深まりますよ！
私が使用したおすすめの本はこちらです。
コメント