响应式CSS设计,显示的Adsense广告:无

Question

我希望在max-device-width480px 时不显示右侧边栏(包含广告).如果我使用display:none;它违反了Adsense ToS.那么,什么是好的解决方案？

Answer 1

这里的问题是，如果您使用display: none，您就违反了Adsense 条款和条件。这是因为，尽管广告被隐藏，但它仍然算作广告商的浏览次数。

到目前为止，Google 对此的反应非常缓慢，但我已经实现的方法以及许多人现在正在采用的方法是在页面加载时检测窗口宽度，并根据窗口大小启动或不启动 Adsense。

Labnol对此有一篇很棒的文章。

本质上，您的脚本需要如下所示：

<script type="text/javascript">
    // <![CDATA[
        var width = window.innerWidth || document.documentElement.clientWidth; google_ad_client = "ca-publisher-id";
        if (width >= 800) {
            google_ad_slot = "ad-unit-1";
            google_ad_width = 728;
            google_ad_height = 60;
        } else if ((width < 800) && (width > 400)) {
            google_ad_slot = "ad-unit-2";
            google_ad_width = 300;
            google_ad_height = 250;
        } else {
            google_ad_slot = "ad-unit-3";
            google_ad_width = 320;
            google_ad_height = 50;
        }
    // ]]>
</script>

<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">// <></script>

在此基础上扩展您的具体示例，您可以在初始化 Adsense 之前使用以下方法检测屏幕宽度：

var width = window.innerWidth || document.documentElement.clientWidth; google_ad_client = "ca-publisher-id";
if (width >= 480){
    // initalise Adsense here
}

初始化您的 Adsense。这样，只有当屏幕宽度大于480px时才会发生。

需要记住的一件重要事情：虽然这将确保在访问设备的屏幕太窄时不会加载您的广告服务，但它并不能解决访问者在屏幕太窄时显示（或不显示）广告的问题然后选择调整浏览器窗口的大小。display: none除了用于覆盖用户以大浏览器宽度加载网站然后缩小浏览器宽度的情况之外，我还没有找到一种简单的方法来解决解决方法的这个特定方面。

最后一点：Google 现已开始推出 DFP 响应式广告。