云码酷 发表于 2022-11-14 12:05:49

用CSS解决Google谷歌广告在不显示时的空白区域

插入谷歌广告之后没有显示出来,而是一大片空白,这就有点尴尬了。可能是没有匹配的广告,也有可能是网络原因导致没有显示。本文尝试用CSS来解决这个问题。首先,了解一下谷歌广告展示的过程:
(网页打开,加载谷歌广告的js代码)网页:老哥,这个位置来点广告啊谷歌:我看看你这广告放点啥网页:快点啊,我都加载完了你这还没搞出来!谷歌:你这没有合适的广告放啊...喂喂喂,信号有点不好...喂喂喂,人呢?网页:????
由于网络不科学,以及内容匹配等各种原因,谷歌广告其实经常显示不出来,这样在广告位的地方就留了一个大空白。



个人觉得这样挺影响网页的美观的。于是就寻思着怎么解决这个问题。在网上找到了明月博主的一篇文章:

发现现在谷歌广告后台没有这个选项了。那么就尝试自己动手操作下。将以下 CSS 样式添加到网页中,以自动隐藏广告空缺的广告单元:在主题中,就是在后台的开发者设置——>自定义 CSS添加:ins.adsbygoogle {
    display: none !important;
}


如果不想直接隐藏,而是想要展现自己的图片:<script async src="xxxxxxxxxxxxxxxxxx"></script>
<ins class="adsbygoogle"
   style="display:inline-block;width:300px;height:250px"
   data-ad-client="caxxxxx"
   data-ad-slot="xxxxx">
    <a href="https://www.webzx.net"><img src="https://www.webzx.net/云码酷广告图片.jpg" width="300px" height="250px"></a>
</ins>
<script>
   (adsbygoogle = window.adsbygoogle || []).push({});
</script>
这个里面的img就是自己的图片以及a标签里的是点击图片跳转的超链接。加入CSS:ins.adsbygoogle a {
    display: none !important;
}
ins.adsbygoogle a {
    display: block;
}

94kpni 发表于 2022-11-14 12:05:50

向楼主学习

yho 发表于 2022-11-14 12:11:58

支持楼主,用户楼主,楼主英明呀!!!

2cj91 发表于 2022-11-14 12:14:58

站位支持

izxj 发表于 2022-11-14 12:21:50

元芳你怎么看?

a_6 发表于 2022-11-14 12:28:39

顶顶更健康

94r7z 发表于 2022-11-14 12:30:55

回个帖子,下班咯~

bjgh 发表于 2022-11-14 12:32:13

1v1飘过

k06 发表于 2022-11-14 13:02:51

我也是坐沙发的

8vrl8 发表于 2022-11-14 13:07:54

嘘,低调。
页: [1] 2
查看完整版本: 用CSS解决Google谷歌广告在不显示时的空白区域