特価箱

特価品やセール情報など毎日お知らせ

STINGERで簡単にアドセンスをダブルレクタングル表示させる方法

2018/07/21

このブログでは、少し古いWordPressテーマ「STINGER PLUS」を利用しています。

STINGERの他のバージョンでも大体同じですが、記事下の広告はデフォルトで縦並びになっています。
ですが横並びの方が一般的ですし、見栄えも良いです。

 

ただ、STINGERでやろうとすると自分で少し手を入れる必要があります。

phpの変更やプラグインも不要でダブルレクタングル表示

「STINGER ダブルレクタングル」といった感じで検索すると、phpをいじるのがメジャーの模様。上位に表示されるのは大体そうです。

「たかが横並びにするだけなのに面倒だな」と思って他を探したところ、こちらのサイト様の方法で簡単に出来ました。

モバイル・スマホ・HTML5のSEO塾.com

この方法を使うと、ウィジェットの「カスタムHTML」で簡単に横並びダブルレクタンダルを表示可能です。

※STINGERのウィジェットには、デフォルトでアドセンス用の場所が用意されていますが、そこは使いません。

<div class="ad2para">
<div class="adLeft">
左側のAdSenseコード:レクタングル大(336x280)
</div>
<div class="adRight">
右側のAdSenseコード:レクタングル大(336x280)
</div>
</div>

ただ、STINGERの場合は記事幅が狭いので、そのまま336を2枚横並びにはできません。
記事幅を別途広げれば良いのですが、当ブログではそれはせず、300×250を2枚横並びにしています。

当然アドセンス以外の広告でも可能です。

 

CSSもそのまま利用させて頂きました。

.ad2para { marginやpaddingなど }
.ad2para:after { content:""; display:block; clear:both; }
.adLeft, .adRight{ float:left; margin-left:16px;}

たったこれだけです。

ウィジェットなので、記事下以外にも簡単に挿入出来ます。

PCとスマホで分ける必要あり

PCでの表示はこれで問題ありませんが、このままですとスマホの表示に問題があるので分ける必要があります。(スマホでのアドセンス連続表示はNG)

これについては、プラグイン「ウィジェットのロジック」がお勧めです。

これをインストールすると、ウィジェットの下に項目が追加されます。

ここに条件を記載する事で分岐が可能になります。

スマホには表示させたくない場合
!wp_is_mobile()

スマホにだけ表示させたい場合
wp_is_mobile()

ダブルレクタングル用のウィジェットはスマホでは表示させない。
それとは別にスマホ用を用意し、こちらはスマホだけ表示の条件を付ければ良い訳です。

このプラグインは他にも条件付け可能なので、入れておくと何かと便利です。

 

double

※Amazonはプライム会員は送料無料。プライム会員以外は合計2000円以上で送料無料です。※

ランキング

ランキングに協力して頂けると助かります⇒人気ブログランキング

-未分類