Google Adsenseが表示される前の黄色い背景色を消す方法

テーマによっては、Google Adsenseの広告が表示される前に背景色が表示されることがあります。

僕が使ったことのある公式テーマ「Twenty Fourteen」「Twenty Fifteen」の場合は、黄色「#fff9c0」の背景色でした(色はテーマの定義によって異なります)。特に問題がある訳ではないのですが、なんか気になる!?ので背景色を変更(非表示)する方法を紹介します。

Google Adsenseが表示される前の黄色背景色

Google Adsenseが表示される前の黄色背景色

背景色を非表示にする方法

テーマのCSSに下記の定義を追加するだけです。これで解決です。

原因について

  1. Google Adsenseのコードに「insタグ」が使われている。
  2. テーマに「insタグ」の背景色が定義されている。

<ins>はinsertの略で、<ins>~</ins>で囲まれた部分が後から追加された部分であることを示します。 追加の理由やコメントの文書がある場合には、そのURIを「cite属性」で指定しますが、 内容が簡単な場合には「title属性」で記述する方法もあります。 追加された日時を指定する場合は「datetime属性」で指定します。

対処法について

当然ですが①を変更することはできません。②を修正する必要があります。

僕自身「insタグ」を使用したことはないので、直接「insタグ」の定義を変更してもいいのですが、そうすると記事内で「insタグ」を使用した際の背景色も変更されます。

できれば、Google Adsenseの広告のみ変更できるのがベストです。

そこで、Google Adsenseの「insタグ」には、必ず「style属性」が付加されていることを利用して、属性セレクタ「ins[style]」で背景色を「transparent(透明)」に定義したのが今回の方法です。

この方法なら、「style属性」が付加された「insタグ」のみ背景色が透明になります。

通常の「insタグ」に影響はありません。

最後に

最初にも言いましたが、背景に色がついているからといって特に問題がある訳ではありません。

気になる方のみ、今回紹介したCSSを追加して下さい。

スポンサーリンク
スポンサーリンク