AFFINGER（Ver.20151021）でトップの記事一覧に広告を入れる方法

さて、AdSenseのクリックが入らない現状を打破すべく、この度、広告の配置について会議を開催しました。

会議では活発な意見が飛び交いましたが、結果として全会一致で、最近Yahoo!のスマホ画面でも採用されている様にトップ画面の記事一覧へ、記事と記事の間に広告を入れる形で決定した次第です

尚、会議の出席者は１名です（笑）

当ブログのWordPressテーマは「お金を稼ぐ」に特化したAFFINGER（アフィンガー）です！

（現在はAFFINGER２にヴァージョンアップしております/2016年12月現在）

ということで、その方法について調査しましたが、当ブログのテーマ「AFFINGER」で記事一覧の中に広告を入れる方法は結局のところ見つかりませんでした・・・

Stingerについての情報はかなり多く出ていますが、まだ、AFFINGERのカスタマイズに関する情報は圧倒的に少ないのが現状です

よって、Stinger５の設定方法を参考にチェレンジを試みました！

作業にあたっては「cv0629」さんのStinger5の方法を参考とさせて頂きました

先に結論を申し上げます！

なので、僕があえて説明するまでもなく、全てcv0629さんのご説明の通りに進めて頂ければOKなのですが、一応、実際の設定画面も交えながらご紹介したいと思います

アフィンガーのヴァージョンは「20151021」です

当初のトップ画面はこのような感じで、最新記事の一覧が表示されています

cv0629さんのご説明の通り、「外観」→「テーマの編集」→「itiran.php」を開き、先ずは上の図の赤枠内の部分を書き換えます。上はまだ書き換え前です

書き換え後です

これに書き換え↓

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

次は上の図の赤線矢印の箇所に下記を挿入します

これを挿入↓

<?php if ( $loop_count == 3 || $loop_count == 7 ) : ?>

<div class="toppagead">

<p style="color:#666;margin-bottom:4px;text-align:center;">スポンサーリンク</p>

ここにアドセンスのコードを挿入

</div>

<?php endif; ?>

「ここにアドセンスのコードを挿入」の部分に指定のコードを入れます。レスポンシブがおススメです♪

挿入後です

続けて「style.css」を開き、一番下の部分に下記を追加して下さい

これを追加↓

.toppagead { margin-bottom: 20px;

padding-top: 10px;

padding-bottom: 20px;

border-bottom: 1px dotted #999;

以上で作業は完了です！

ブログのトップページを確認すると、記事の間にAdsenseの広告が表示されました♪

尚、広告の表示位置を変えたい場合については（何番目の記事の下に表示するのか？）cv0629さんのブログで非常に分かり易くご説明頂いているのでご確認下さい♪

や～予想よりも見事にできたので一人でニマニマしてしまいました（笑）

この形でどれだけ収益が増えるものか楽しみに見ていきたいと思います♪

尚、このブログはその後、AFFINGERを最新のAFFINGER2ver20151214にヴァージョンアップしております。AFFINGER2の場合「テーマの編集」項目が異なりますので、次回改めてご説明致したいと思います！

この度はcv0629さんには大変お世話になりました。改めて心より御礼申し上げる次第です！