Stinger8

【WordPress】Stinger8で記事一覧の間にアドセンスを挿入する方法【Google Adsense】

今回は記事一覧の中にアドセンスを挿入する方法です。

なお、こちらの記事はstinger8に関する記事です。
stinger plus2の場合はこちら

【WordPress】Stinger Plus2で新着記事の間にアドセンスを挿入する方法【Google Adsense】
今回は記事一覧の中にアドセンスを挿入する方法です。 なお当記事はstinger plus2に関する記事です。 stinger8の場合は、こちらをご覧ください。 そこまで難しくはなくコピペでできますが、 カスタマイズに...

そこまで難しくはなくコピペでできますが、
カスタマイズになるので、子テーマを使用しましょう。

子テーマについてはこちら!

【WordPress】テーマをカスタマイズをするときは、子テーマを使うべし!
WordPressの機能の一つとして、 「子テーマ」というものがあります。 ブログを書き始めた方の場合や、 WordPressを使い始めた方の場合は、 「子テーマ?なんだそれ」とか 「親テーマにそのままコードを書けばいいじゃん...
【WordPress】子テーマの導入方法と使い方を覚えてガンガンカスタマイズする!
前回こちらの記事で、 子テーマの重要性について説明しました。 今回はその子テーマの導入方法と、 使い方についてご説明します。 子テーマを導入する! 子テーマを導入する方法は2通りあります。 1つは親テーマと一緒にダウ...
スポンサーリンク
新たにレンタルサーバーを選ぶならこれ!
エックスサーバー
  • 国内シェアNo.1の高速サーバーなのでストレスフリー!
  • 自動バックアップ機能に標準対応で安心運用可能!
気になるポイント!キャンペーン中に契約すれば.com等のドメインを永久無料で使えます!
WordPressでサイトを運用すると重くなりがちですが、使用しているレンタルサーバーのスペックがあまり良くないと、どんなにWordPress側で高速化をしていても、なかなか高速化の成果が反映されません。サイトの表示スピードが上がらない原因がレンタルサーバーの場合は、エックスサーバーにしてみると改善するかもしれません! またサーバー等のバックアップを自動で行っているので、安心してサイトの運用をすることができます! またマルチドメイン、メールアドレスを無制限で使えるというのもうれしいですね。

公式サイトはこちら

itiran.phpを編集する!

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

まずはitiran.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の色等については、
自分のサイトに合うよう調整してください。

これで以下の通りになります。

これでうまく表示されていれば、
完成です!

広告の貼り過ぎにはご注意!

どんなに良質なコンテンツであっても、
広告だらけで、読みにくいブログは嫌厭されてしまいます。

適度な数の広告にすることをこころがけましょうー

Stinger8のカスタマイズ記事まとめはこちら!↓

【プログラミング入門最強の味方】STINGER8カスタマイズまとめ
WordPressのテーマStinger8のカスタマイズ記事が増えてきたので、 記事を種類別に分類をしてみました。 STINGER8は基本的には、最低限の機能しかないまっさらなテーマです。 その分非常にカスタマイズがやりやすく、H...

コピペも良いですが・・・

カスタマイズ記事はコピペできるものもあり、便利ですが、もし分かりずらかったりする場合は、本などを併せて使用すると、理解度が深まりますよ!

私が使用したおすすめの本はこちらです。

コメント