最近发现投放的Google Adsense自适应广告显示的高度太大啦，虽说挂广告是为了赚点广告费，补贴下昂贵的服务器费用，但显示的广告尺寸过大，可以说是严重影响用户体验。
检测google广告加载全显示的代码发现，原本限制广告高度的父元素样式都被google自动加了!important声明的代码覆盖啦！google广告代码是异步加载的，而且在标签style属性里面加了!important样式声明，自己再想写CSS去覆盖goolgle的CSS样式声明的方法根本就行不通，不可行！
测试了google 广告单元代码，发现不加 data-ad-format 参数就不会在广告单元标签的父元素上自动添加!important声明。
如果不需要限制广告高度的广告单元 ，其代码标签的data-ad-format 参数可设为true，即data-ad-format ="true";
如果想解决显示的广告单元高度过高这一影响用户体验的问题，首先去掉google广告单元代码中的data-ad-format 参数声明，然后按下面的方法来定义/限制google 广告高度↓↓↓
1、高度固定的可展开宽度示例
以下示例显示如何修改自适应广告代码，以指定高度和宽度，其中：高度为 90 像素（固定），宽度在 400 像素（最小值）到 970 像素（最大值）之间。
注意：替换掉自己的发布商ID和参数值；
2、根据屏幕宽度指定确切宽高尺寸
如果知道在每种设备上最适合您的自适应网站的确切广告单元尺寸，则您可以使用 CSS3 媒体查询来设置自适应广告单元的尺寸。下面的示例显示了如何修改广告代码以使用 CSS3 媒体查询：
注意：替换掉自己的发布商ID和参数值；
@media 规则是一种 CSS3 语法，当前所有主流浏览器均支持这种规则。如果您想要支持比较旧的浏览器（例如 Internet Explorer 7 或更低版本），建议先指定默认尺寸。这样可以确保即使媒体查询不受支持，广告也可正常展示。请注意，目前尚未正式支持通过 CSS 在外部样式表中设置广告代码的尺寸。
在某些情况下，尤其是在较小的移动设备上，您可能完全不打算展示广告。如果您确实希望隐藏广告单元，可以使用上述提到的 CSS 媒体查询来设置参数，确保不发出广告请求且不展示广告。
参考链接
https://support.google.com/adsense/answer/9183460?hl=zh-Hans
https://support.google.com/adsense/answer/9183363?hl=zh-Hans
转载于：https://www.phpvar.com/archives/4586.html
支付宝打赏
微信打赏