AdSnseの広告に出る黄色の背景を消すCSS（スタイルシート）

Sat, 23 May 2020 15:02:46 +0900

余計な黄色の背景や余白を消す

AdSense広告を設置したページを開くと、広告が表示される部分に広告は表示されていないけど、全面に黄色い背景が表示されていたり、広告は表示されているけど、黄色い部分が一部表示されていたります。

これをそうにかできないかな？と方法を探したところ、消すというよりCSS（スタイルシート）で透過せることで解決できることがわかりました。

CSS（スタイルシート）例

以下の1行を既存のスタイルシートか、AdSenseの広告コードに加えるだけです。このコードは**『透明』**を意味するスタイルシートのコードです。これでAdSense広告の背景を透過させることができます。

background: transparent;

AdSenseの広告コードに加えた例

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
 <ins class="adsbygoogle"
 style="display:block; text-align:center; <span class="brush:css;">background: transparent;</span>"
 data-ad-layout="in-article"
 data-ad-format="fluid"
 data-ad-client="ca-pub-XXXXXXXXXXXXXXXXX"
 data-ad-slot="XXXXXXXXXXX"></ins>
<script>
 (adsbygoogle = window.adsbygoogle || []).push({});
 </script>

スタイルシートに加えた例

複数のAdSense広告があり、全部ページに共通のCSSで適用する場合は、以下の1行を加えればOKです。

.adsbygoogle { background: transparent;}

黄色の部分が消えた！