插入谷歌广告之后没有显示出来,而是一大片空白,这就有点尴尬了。可能是没有匹配的广告,也有可能是网络原因导致没有显示。本文尝试用CSS来解决这个问题。

首先,了解一下谷歌广告展示的过程:

(网页打开,加载谷歌广告的js代码)

网页:老哥,这个位置来点广告啊

谷歌:我看看你这广告放点啥

网页:快点啊,我都加载完了你这还没搞出来!

谷歌:你这没有合适的广告放啊...喂喂喂,信号有点不好...喂喂喂,人呢?

网页:????

由于网络不科学,以及内容匹配等各种原因,谷歌广告其实经常显示不出来,这样在广告位的地方就留了一个大空白。

谷歌广告留下的空白

个人觉得这样挺影响网页的美观的。于是就寻思着怎么解决这个问题。

在网上找到了明月博主的一篇文章:

谷歌 AdSense 广告空白的优化美化

没有自定义渠道了

发现现在谷歌广告后台没有这个选项了。

那么就尝试自己动手操作下。

将以下 CSS 样式添加到网页中,以自动隐藏广告空缺的广告单元

在handsome主题中,就是在后台的开发者设置——>自定义 CSS添加:

ins.adsbygoogle[data-ad-status="unfilled"] {
    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.52txr.cn"><img src="https://www.52txr.cn/广告图片.jpg" width="300px" height="250px"></a>
</ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

这个里面的img就是自己的图片以及a标签里的是点击图片跳转的超链接。

加入CSS:

ins.adsbygoogle a {
    display: none !important;
}
ins.adsbygoogle[data-ad-status="unfilled"] a {
    display: block;
}

博主个人公众号
版权声明 ▶ 本网站名称:陶小桃Blog
▶ 本文链接:https://www.52txr.cn/2022/SolveBlankAdSense.html
▶ 本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长进行核实删除。
▶ 转载本站文章需要遵守:商业转载请联系站长,非商业转载请注明出处!!

最后修改:2022 年 06 月 15 日
如果觉得我的文章对你有用,请随意赞赏