谷歌 DFP 响应不工作答案

【问题标题】：Google DFP Responsive Not Working谷歌 DFP 响应不工作
【发布时间】：2017-08-16 21:05:24
【问题描述】：

是否有人介意查看我的代码，尝试让我的 DFP 广告具有响应性，因为我的网站都是响应式的？我按照 Google DFP 上的示例，当我尝试移动屏幕时，广告似乎没有缩小（并且根本没有显示在真实的移动屏幕上）下面的代码在我的 Header 文件中。

我很确定我正确地映射了事物。我想知道我是否还必须对正文代码进行任何更改，或者我是否必须上传调整大小以适应移动屏幕的新广告？

<script async='async' src='https://www.googletagservices.com/tag/js/gpt.js'></script>
<script>
  var googletag = googletag || {};
  googletag.cmd = googletag.cmd || [];
</script>

<script>
  googletag.cmd.push(function() {

    var mapping = googletag.sizeMapping().
    addSize([992, 0], [[970, 90], [728, 90], [300, 250], [1, 1]]). //desktop
    addSize([768, 0], [[300, 250], [728, 90], [1, 1]]). //tablet
    addSize([320, 0], [[320, 50], [320, 100], [300, 250], [1, 1]]). //mobile
    addSize([0, 0], [[320, 50], [1, 1]]). //other
    build();

   slot1 = googletag.defineSlot('/316721235/DL-TestAds', [728, 90], 'div-gpt-ad-1496860907063-0').defineSizeMapping(mapping).addService(googletag.pubads());
    googletag.pubads().enableAsyncRendering();
    googletag.enableServices();
  });
</script>

【问题讨论】：

标签： javascript responsive google-dfp

【解决方案1】：

您必须自己检测浏览器窗口大小何时发生变化，然后通过调用刷新触发广告重新展示。

监听 resize 事件以检测浏览器窗口何时改变大小。

window.addEventListener('resize', function (event) { // 检查 window.documentElement.clientWidth

}

【讨论】：

【解决方案2】：

+1 对 BeWarned 的回答：响应式映射是在页面加载时设置的。如果修改了窗口尺寸，则应重新启动广告位调用，以便 DFP 能够调用正确的广告尺寸。

【讨论】：