アフィリエイト Wordpress stinger

Stinger6にバージョンアップしてみて必要だったこと

更新日:

Hola!
最近更新していなかったので、モチベーションアップのために、StingerをStinger6にバージョンアップしてみました。

Stinger6で大きく変わったこと(多分)

Stinger6で大きく変わったことは、管理パネルが出来たことだと思われます。
追加機能が盛りだくさんです。

この管理パネルで、何ができるかというと、今までプラグインやカスタマイズでやりくりしていた部分が実は結構できるようになっているという素晴らしい管理パネルです。

・Faviconの設定
・サイドバーの新しい投稿一覧を非表示にする
・投稿一覧のサムネイルを表示しない
・テキスト選択不可にする
・GoogleAnalyticsのコードを埋める

などなど、山ほど有りまして、必要なくなったプラグインがたくさん有って、すっきりしました。

詳細は、オフィシャルの
WordPressテーマ「AFFINGER2」&「STINGER6」 OUT
でご確認ください。

スポンサーリンク

Stinger6にバージョンアップしてみて必要だったこと

※自分への備忘録です。みなさまはご自分にあった設定にしてください。

SINGER管理の設定

下記にチェック
・オリジナルテーマカスタマイザーを使用する
・H3にチェックマークを適応する
・コメント欄を非表示にする
・著者情報を表示する
・固定ページに子ページへのリンクを表示
・サイドバーの新しい投稿一覧を非表示にする
・お知らせをTOPページの一番上に表示する
・テキスト選択不可にする

そして、GoogleAnalyticsのトラッキングコードの埋め込みをして、プラグインを無効にする。
※Google Analytics Dashboard for WPを使用している方は、重複カウントしてしまうため、トラッキングコードを入れない方が良いです。
参考)【注意】 stinger6にしたら、設定ミスでGoogleAnalyticsが2倍のカウントをしてしまった

外観-カスタマイズから、テーマの基本設定

・サイト基本情報のサイトアイコンに画像を入れる
 →Faviconのプラグインを無効にする。
・基本色(キーカラー)の設定 (RSSボタン程度でOK)
・色 背景色を#fffにする。
・ヘッダー画像を設定する (1060×400ピクセル)
・メニュー 古いメニューが生きているので、トップ用とフッター用に設定する。

これだけすれば、とりあえず見栄えはOKです。

スマホでのピンチイン・アウトを有効にする

これは、好みが有ると思いますし、できない設定になっているのは何か意図があるとは思いますが、ホームページ制作時にクライアント様からの要望が多い機能なので有効にしてみました。

header.phpの

<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">

<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0">

に書き換える。

記事中アドセンス

今回からショートコードが組み込まれていまして、この記事を各画面にもボタンが表示されていたりします。

とても良いのですが、アドセンスはウィジェットで設定したものが出てしまうため、
好きなものに変る場合、function.phpをカスタマイズします。

	function st_showads() {
		ob_start();
		get_template_part( 'st-ad' );
		$ads = ob_get_clean();
		return $ads;
	}

	function st_showads() {
		ob_start();
		get_template_part( 'st-ad' );
		$ads = ob_get_clean();
                return '<p style="color:#999;margin-bottom:1px;font-size:10px;text-align:center;">スポンサードリンク</p>
                <div style="padding-bottom:15px;">
※ここにアドセンスコード
                </div>';
	}

に書き換えます。
私はレスポンシブのアドセンスを貼っていますが、PC,スマホで切り替えたい方は、切り替え関数を使うと良いです。

記事下アドセンス

記事下はデフォルトで、PCはレクタングル2つ、スマホは無しになっていますが、ここもレスポンシブをそれぞれに1つ出したいのでカスタマイズです。
single.phpを編集します。

<div style="padding:20px 0px;">
	<?php get_template_part( 'ad' ); //アドセンス読み込み ?>
	<?php if ( st_is_mobile() ) { //スマホの場合 ?>
	<?php } else { //PCの場合 ?>
		<div class="smanone" style="padding-top:10px;">
			<?php get_template_part( 'ad' ); //アドセンス読み込み ?>
		</div>
	<?php } ?>
</div>

<div style="padding:20px 0px;">
	<?php if ( st_is_mobile() ) { //スマホの場合 ?>
		<div style="padding-top:3px;">
<p style="color:#999;margin-bottom:5px;font-size:10px;text-align:center;">スポンサードリンク</p>
※ここにスマホ用アドセンスコード
		</div>
	<?php } else { //PCの場合 ?>
		<div class="smanone" style="padding-top:3x;">
<p style="color:#999;margin-bottom:5px;font-size:10px;text-align:center;">スポンサードリンク</p>
※ここにPC用アドセンスコード
		</div>
	<?php } ?>
</div>

に変えます。
PCとスマホで、アドセンスコードを分けているのは、広告効果を測定するためですが、する必要なければ、st_is_mobile()を無くせばすっきりします。

記事の一覧表示の間にアドセンスを入れる

最初は入っていない記事の一覧表示の間にアドセンスを入れたものも、当然テーマの差し替えで無くなります。
itiran-thumbnail-on.phpを編集します。(itiran-thumbnail-off.phpもほぼ同じです)

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

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

に書き換え

	</dd>
</dl>
<?php endwhile;
else: ?>

の間に追加して

	</dd>
</dl>
<?php if ( $loop_count == 5 || $loop_count == 10 ) : ?>
<div style="padding-bottom:15px;">
<p style="color:#999;margin-bottom:1px;font-size:10px;text-align:center;">スポンサードリンク</p>
※ここにアドセンスコード
</div>
<?php endif; ?>
<?php endwhile;
else: ?>

とします。
loop_countの数は自由です。

固定ページの上と下にadsenseを入れる

固定ページをサイトマップや、目次に使っています。
なので、固定ページ中にadsenseを貼りませんので、ページ上下にadsenseを入れます。

page.phpを編集します。
下記2か所にアドセンスコードを入れてください。

<article>

<div style="padding-bottom:15px;">
<p style="color:#999;margin-bottom:1px;font-size:10px;text-align:center;">スポンサードリンク</p>
<?php if(st_is_mobile()) { ?>
※ここにスマホバナー 高さが小さくないと上部バナーと競合してアドセンス違反となります。
<?php } else { ?> 
※ここにレスポンシブ
<?php } ?>
</div>

<!--ループ開始 -->
<!--ループ終了 -->

<div style="padding-bottom:15px;">
<p style="color:#999;margin-bottom:1px;font-size:10px;text-align:center;">スポンサードリンク</p>
※ここにレスポンシブアドセンス
</div>

</div>
<!--/post-->

忘れがちなnendの広告コード

PCで作業していると、ついつい忘れがちなnendの広告コードです。
header.phpを編集します。

headタグが閉じる前に

<?php if(st_is_mobile()) { ?>
※NENDの広告コード
<?php } else { ?>
<?php } ?>

と埋め込みます。

nendのオーバーレイ広告を入れるとPageTopと重なってしまう

nendのオーバーレイ広告を入れると、右下に出るPageTopへのボタンが広告と重なってしまいます。
非常に使い勝手が悪いので、下記のようにすると良いです。
style.cssを編集します。
bottom:20pxを40~50にすると丁度良くなります。

#page-top {
	position: fixed;
	z-index: 9999;
	bottom: 20px;
	right: 0px;
	font-size: 12px;
}

最後にcssを少し

トップに表示されるお知らせ(設定していない人は関係ありません。)
の日付がiPadだと少しおかしくなるので、
style.cssの下の方の下記の記述のfont-sizeを12pxくらいにするとちょうど良いです。

	#topnews-box dt {
		font-size: 14px;
		margin-bottom: 5px;
		padding-bottom: 5px;
		float: left;
		width: 80px;
		clear: both;
	}

Stinger6にバージョンアップして今更気づいたこと

ずっとPCの右上には、ウィジェットで設定した336pxの広告が出ていると思っていましたが、
実はここにはPCでもスマホでも、スマホ用の設定の300pxが出ていたのですね。(恥ずかしい)

広告の効果測定で、やっぱり右上は良いなぁと思っていましたが、何てことは有りません。
PCの右上とスマホとの合算ですから、それは良いはずです。

広告の効果測定をしたい方は、ウィジェットのPC用の広告サイズを300pxにしたうえで
sidabar.phpを

<div class="ad">
<?php if ( st_is_mobile() ) { //スマートフォン ?>
	<?php if ( function_exists( 'dynamic_sidebar' ) && dynamic_sidebar( 4 ) ) : else : //アドセンス ?>
	<?php endif; ?>
<?php } else { //PCの場合 ?>
	<?php if ( function_exists( 'dynamic_sidebar' ) && dynamic_sidebar( 3 ) ) : else : //アドセンス ?>
	<?php endif; ?>
<?php } ?>
</div>

にしてみてください。(アドセンスを読むところに直接コードを入れても良いと思います。)

さすがのStingerですので、あっという間にSEO対策に優れた綺麗なサイトを更新できました。

-アフィリエイト, Wordpress, stinger

Copyright© 上善如水 , 2019 All Rights Reserved.