アドセンスを中央寄せする方法

アドセンスを記事に貼ってみたら、なんか右にずれてたり左にずれていたり、しっくりこないことがありませんか?

見た目にもかっこ悪いし、クリック率にも影響しそうだから、どうせならちょうど真ん中にドーンときっちりズレずに配置したいですよね?

そこでここでは、グーグルアドセンス広告(コード)を中央寄せ(センター寄せ)する方法をコピペですぐ利用できるようにまとめます。

■この記事を読めば分かること
[imglist icon=”dot1″ color=”orange”]

  • アドセンスを真ん中に配置する方法
  • センタリングできるけど間違った方法

[/imglist]

アドセンスを中央寄せ(センタリング)する正しい方法

アドセンスを記事にそのまま貼ると

ハワイ5日間

こんな感じに左に寄るのがデフォルトです。

これをピッチリ「ど真ん中」に寄せていきます。

STEP1.アドセンスコードをHTMLタグで囲む

アドセンスを中央寄せする方法で現在、正しいとされているのがHTMLタグとCSSコードを使った方法です。

まずアドセンスコードを以下のHTMLタグで囲みます。

<div class=”ad-center”>
※ここにアドセンスコードを挿入※
</div>

STEP2.アドセンスを貼り付けて保存する

HTMLタグで囲ったアドセンスコードを記事の任意の場所に貼り付けて、記事を保存(更新)します。

STEP3.CSSコードを貼り付ける

そして次に以下のCSSコードをWordPressや無料ブログのCSS(スタイルシート)の一番最後に貼り付けてください。

.ad-center{
text-align:center;
}

WordPressなら外観>カスタマイズ>追加CSSと開いていって「追加CSS」の欄の一番最後にこのCSSコードを貼り付けましょう。

STEP4.記事を開いて確認しよう

ここまでの作業が完了したら該当する記事を開いてみます。

すると以下のように

ハワイ5日間

メインカラムへのセンター寄せが実現できているはず!

アドセンスを中央寄せできるけど間違っている4つの方法

以下の4つの方法でもアドセンスを中央寄せできます。

<center>
※ここにアドセンスコードを挿入※
</center>
<div style=”text-align:center;”>
※ここにアドセンスコードを挿入※
</div>
<p style=”text-align:center;”>
※ここにアドセンスコードを挿入※
</p>

この4つはどれも記事にHTMLタグで「スタイルの指定」をしています。

一部のサイトではこれらの方法が推奨されていますが、HTMLの構文として理想的ではないため、現在ではNGですよ。

※スタイルの指定はCSSでするのが常識となっていますので……。

WordPressのプラグインで中央寄せする方法もNG

WordPressのプラグインでアドセンスを自動挿入ができる

[imglist icon=”dot1″ color=”orange”]

  • WP QUADS
  • Advanced Ads

[/imglist]

にはアドセンスを中央寄せしてくれる機能がついています。

しかし、これらの機能を使うと、上記3つのどれかのコードが自動的に使われることになるので、こちらもオススメできません……。

まとめ

というわけでアドセンスの中央寄せは
[imglist icon=”dot1″ color=”orange”]

  • HTMLタグでアドセンスを囲む
  • CSSにコードを追記する

[/imglist]
こうやって真ん中に寄せるのがベスト。

それ以外のNGな方法として紹介した4つの方法を使ったからといって、検索順位が下がったりクリック率が下がったりはしません。

が、どうせなら正しい方法を選びたいですよね。