
WordPressウィジェットにAdSense広告を貼ったときの余白を取り除く2つの方法

WordPressのウィジェットエリアにAdSense広告コードを設置した際、広告の上下に不要な余白が表示されることがあります。CSSのカスタマイズやテーマファイルの変更に踏み込む前に、まずシンプルな2つの方法を試してみましょう。多くのケースでこれだけ解決できます。
AdSenseコードの改行を削除する
Googleが発行するAdSenseコードをそのままコピーすると、複数の改行が含まれています。このコードをWordPressのウィジェットに貼り付けると、改行が自動的に <br> タグや余分な段落タグに変換され、広告の周囲に空白スペースが生じます。
対処方法は、AdSenseコードをテキストエディタで開き、改行をすべて削除して1行に整形してからウィジェットに貼り付けることです。改行がなければ自動変換も発生しないため、余白が出なくなります。

ビジュアルモードではなくHTMLモードで貼り付ける
テキストウィジェットやカスタムHTMLウィジェットを使ってAdSenseコードを設置する場合、入力モードの選択が重要です。
ビジュアルモード(または「ビジュアルエディター」)でコードを入力すると、HTMLタグがそのまま文字として表示されてしまい、広告が表示されません。必ずテキストモード(またはカスタムHTMLウィジェット)を使用してください。ビジュアルモードで誤って入力した場合は、タブを切り替えてHTMLモードで確認・修正する必要があります。
まとめ
ウィジェットにAdSense広告を設置した際に余白が生じる原因のほとんどは、コード内の改行と入力モードの問題です。
- AdSenseコードは改行なしの1行に整形してからウィジェットに貼り付ける
- 入力はビジュアルモードではなくテキストモード(HTMLモード)で行う
上記2点を確認してもまだ余白が気になる場合は、CSSで margin や padding の値を調整することで対応できます。ブログ上のAdSense設置でお困りの方はレンタルサーバー比較「ペガブロ」のWordPress設定ガイドも参考になります。

