Question

对于单页应用，我想知道是否可以申请新广告，以替换div容器中的现有广告

var slotName = '/blogs/peter/recentPosts' // this changes according to route
var adContainer = 'div-common-container' // this never changes
window.googletag.defineSlot(slotName), ['fluid'], adContainer).addService(this.googletag.pubads())

到目前为止我找到的示例，确认可以刷新现有的slots，但我的用例不同（https://support.google.com/dfp_premium/answer/2694377?hl=en&ref_topic=4390040）

我的目标是为常用模板页面和每个分类不同的pageTransition设置一个公共广告容器元素请求新广告。

到目前为止我做过的当前测试，尝试只更改slotName然后调用refresh（）但它似乎没有工作！例如（比以下示例更复杂，但只是为了公开这一点）：

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

  <script>
    googletag.cmd.push(function() {
      myAddSlot = googletag.defineSlot('/6355419/Travel/Europe/France/Paris', ['fluid'], 'div-common-ad-container')
                  .addService(googletag.pubads());
      googletag.enableServices();
    });
  </script>
</head>
<body>
  <div id='div-common-ad-container' />
  <button id="refresh">refresh</button>
  <script>
  googletag.cmd.push(function() { googletag.display('div-common-ad-container'); });
  document.querySelector('#refresh').addEventListener('click', function () {
    googletag.destroySlots()
    googletag.cmd.push(function() {
      myAddSlot = googletag.defineSlot('/6355419/Travel', ['fluid'], 'div-common-ad-container')
                  .addService(googletag.pubads());
      googletag.enableServices();
    });
  })
  </script>
</body>
</html>

任何提示都表示赞赏！

Answer 1

有专门的方法可以重新加载/刷新没有整个页面的广告，可以很好地与 SPA 应用程序配合使用

googletag.cmd.push(function () {
    googletag.pubads().refresh();
});

你可以将它包装成函数并调用它，例如之前：

googletag.cmd.push(function () {
  googletag.display('advertisement_div_id_tag_name');
})

请记住是否使用谷歌有子句的刷新功能。见clause

<块引用>

重要提示：为了遵守 Google 政策并使您的广告资源能够在 Ad Exchange 上展开竞争，您必须声明广告资源的哪些部分会刷新。

Answer 2

这可能对将来的其他人有用。不确定这是否是最好的方法，但它确实有效。

我正在使用gpt提供的方法销毁广告位，同时清除容器元素和data-google-query-id属性！

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

  <script>
    googletag.cmd.push(function() {
      myAddSlot = googletag.defineSlot('/6355419/Travel/Europe/France/Paris', ['fluid'], 'div-common-ad-container')
                  .addService(googletag.pubads());
      googletag.enableServices();
    });
  </script>
</head>
<body>
  <div id='div-common-ad-container'></div>
  <button id="refresh">refresh</button>
  <script>
  googletag.cmd.push(function() { googletag.display('div-common-ad-container'); });
  document.querySelector('#refresh').addEventListener('click', function () {
    googletag.destroySlots()
    document.querySelector('#div-common-ad-container').setAttribute('data-google-query-id', '')
    document.querySelector('#div-common-ad-container').innerHTML = ''
    googletag.cmd.push(function() {
      myAddSlot = googletag.defineSlot('/6355419/Travel/Europe', ['fluid'], 'div-common-ad-container')
                  .addService(googletag.pubads());
      googletag.enableServices();
      googletag.display('div-common-ad-container');
    });
  })
  </script>
</body>
</html>

GPT在同一div元素中重新加载广告

2 个答案: