Stinger5で記事下のアドセンス横並び(ダブルレクタングル)がズレた時の対処法

2016/12/27

こんにちは！工学部生のとととです！

今回はWordpressテーマの「Stinger5」で記事下の横並び広告(ダブルレクタングル)がズレてしまっていたので、それを修正する方法を詳しく説明したいと思います。

アドセンス横並びはPCでしか見れませんが、デザイン的に気にする方も多いと思いますのでぜひ参考にしてください。

スポンサードリンク
　

問題点

まずどうなってしまっていたかです。

ある日ふと自分のサイトを見ると…

！！

横並びがズレてる…。今まで普通に並んで表示されてたのに…。

どういうこっちゃ！

原因は単純で、記事幅が広告２つ分の幅より小さいことなんです。

おそらくデザインを弄ってる時に何らかの原因でstyle.cssファイル内のCSSの#wrapperとの調整がズレてしまったのでしょう。

なので解決法はその辺りを再調整すれば良いということになります。

というわけでstyle.cssファイルを弄って再調整してみましょう！

まず[ダッシュボード]→[テーマの編集]と移動してください。

移動した画面でキーボードから[Ctrl]＋[F]のコントロールコマンドを使います。

ページ内検索をするコントロールコマンドですので覚えておくと便利ですよ。

検索ボックスが開いたら「wrapper」と入力し、検索してください。

デフォルトだと、

#wrapper {
	max-width: 1100px;
	padding: 0 10px;
	margin: 0 auto;
}

#wrapper {

max-width: 1100px;

padding: 0 10px;

margin: 0 auto;

}

となっていますが、今回はこれを弄ります。広告の幅を弄る方法もありますが、Googleアドセンスから何を言われるかわからないのでおススメはしません。

デフォルトの状態で、おそらくStinger5だとmax-widthが1100pxになっているのではないでしょうか？

それだと広告×2の幅より小さいので、この数値を大きくしましょう。

僕の場合ですと、maxwidth:1100px→1179px;

#wrapper {
	max-width: 1179px;
	padding: 0 10px;
	margin: 0 auto;
}

#wrapper {

max-width: 1179px;

padding: 0 10px;

margin: 0 auto;

}

とすると上手くいきました。1500pxあたりから値を落としていくとちょうどいい幅が見つかると思います。

しっかり横並びで表示されましたね。よかったよかった。

記事幅全体を広げると各所に弊害(特にメニューまわり)が出てくることがあるので、最後に[Ctrl]＋[F5]でキャッシュ無効化でリロードしてサイトを全体を確認してください。

以上、「Stinger5で記事下のアドセンス横並び(ダブルレクタングル)がズレた時の対処法」でした！

スポンサードリンク
　