WordPressに貼ったGoogle AdSense の広告の周りに青色の枠が見える

Google Adsenseで200×200の広告ユニットを作成してサイドバーに貼り付けたんですが、このサイズに合わない広告の場合、余白部分が青く見える現象が発生しました。

見た目カッコワルイので困っていた所、どうやら設定しているテーマで使用しているCSSに<ins>タグがありそこで背景色設定されているのが原因であるのがわかりました。

私が使っているのは Twenty Sixteenというテーマですが他のテーマでも同様の問題が発生する可能性もあります。(テーマによっては青以外のいろのこともあると思います)

以下に私が行った確認方法を書きます

サーバ上のWordPressのテーマのフォルダの中にあるstyle.cssファイルを探して編集します。

<親フォルダ>/wp-content/themes/<テーマ名>/style.css

私の環境では以下のパスになります。

/wordpress/wp-content/themes/twentysixteen/style.css

サーバ環境によってどうやってこのファイルをオープンするかは異なりますが、私はロリポップのレンタルサーバを使っているのでロリポップ!FTPでファイルを開きました。

開いたら <ins>タグを探します。

ins {
 background: #007acc;
 color: #fff;
 padding: 0.125em 0.25em;
 text-decoration: none;
}

background(背景)に設定されている 007acc が先程みた枠の青色です。
ここを ffffff(白)にします。

※ もちろんお使いのテーマの背景色が白以外であればその色に設定します。

 background: #ffffff;

これで余白が青い四角で表示されないようになります。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です