繁体   English   中英

如何正确编写 DFP 页外广告单元?

[英]How to properly write a DFP out of page ad unit?

我正在开发一个 javascript 渲染的移动网络插页式广告。 布局是完全响应的,因此它将占用提供的 screen\\iframe 的 100%。

我现在希望通过 DFP 展示插页式广告。

起初,我创建了一个大小合适的广告单元 (320x480),效果很好,但插页式广告仅限于 iframe 的边界。

我创建了一个名为Out-of-page的新订单项类型。 该文件指出:

它们可能包括弹出窗口和浮动订单项,有时也称为插页式广告。

但是当我尝试在测试站点中嵌入插页式广告时,会发生 iframe 保持 1x1 的情况,使插页式广告不可见(如果我用调试器手动放大它,我会看到它)


我的设置:

  • 广告资源尺寸为 1x1 且页外的订单项
  • 用我的代码片段创意
  • 广告单元的尺寸定义为 1x1

我在文档中读到:

如果您使用的是 DoubleClick 代码广告素材,则必须确保在 DoubleClick 代码的另一端(即另一个 DFP 网络)投放的广告素材代码针对页外广告单元正确编码。

就 DFP 页外插页式广告而言,广告“正确编码”是什么意思? 如何强制插页式广告占据屏幕的所有尺寸?

在咨询 DFP 支持后,我能够按照以下步骤创建页外插页式广告单元:

  1. 创建一个新的广告单元,广告资源尺寸为“页外”
  2. 创建一个新的订单项和一个广告资源尺寸为“页外”的移动广告素材,此订单项定位到以前的广告单元。
  3. 在 Inventory 选项卡下生成新标签,在第 2 步选择“Enable synchronous requests”和“Out of Page”。“Enable synchronous requests”似乎是完成这项工作的关键。

    根据谷歌支持:

    我们通常建议我们的发布商在提供页外(插页式)广告时实施同步 GPT,因为广告素材呈现在元素而不是 iFrame 中

  4. 将此标签放在测试页面中(带有必要的 html、head 和 body 标签),瞧!

不确定这是您需要的,而且我对 DFP 没有太多经验,但我遇到了类似的问题,我通过手动管理 iframe 的大小解决了这个问题。 也许这也可以帮助你。

DFP API 有一个您可以收听的事件,让您知道广告已完成呈现,我建议您将 iframe 属性更改为全宽,并且任何高度都适用于展示位置。

假设您的页面上有 jQuery,这可以很容易地完成。 设置 DFP 插件(调用defineSlot等)后,您可以为该事件添加一个侦听器,如下所示:

googletag.pubads().addEventListener('slotRenderEnded', function(){
  var $adFrame = $('#id-of-the-iframe');
  $adFrame.css({width: '100%', height: '500px'});
});

此处的DFP 文档对此进行了概述。

希望这可以帮助。

编辑:发布后我意识到我发布的代码示例来自 DFP GPT 库。 也许你没有使用这个。 这个 SO 问题有一个指向某人创建的用于侦听 DFP 触发的事件的库的链接。 也许您可以使用它并使用我描述的技术?

再次 - 希望这有帮助:)

我刚遇到这个。 DFP 似乎已经去掉了启用同步请求选项。 由于几个原因,这从来都不是一个很好的解决方案(正如其他人指出的那样)。 首先,如果您在同一页面上有异步请求,则效果不佳。 其次,它会“阻塞”并减慢您的页面速度。

友好的 iFrame

似乎现在首选的方法是使用“友好 iFrame”。 要使用友好 iFrame,请在 DFP 中设置您的广告素材时,取消选中“投放到 SafeFrame”。 DFP 现在会将您的广告投放到“友好 iFrame”中。 友好 iFrame 是从与父窗口相同的域提供的 iFrame。 由于域匹配,浏览器安全规则允许 iframe 中的 JavaScript 访问父窗口(通过window.parent.document )。 现在您可以调整 iframe 的大小以使其全屏显示。 为此,请在您的广告代码中添加如下内容:

window.parent.document.getElementById(window.name).style.cssText = "position: fixed; top: 0; left: 0; bottom: 0; width: 100%; height: 100%; margin: 0;";

如果您的广告可以自行关闭,请确保在关闭时也缩小友好 iFrame(否则展开的友好 iFrame 会阻止底层页面上的鼠标操作)。 你可以这样做:

window.parent.document.getElementById(window.name).style.cssText = "position: relative; width: 0px; height: 0px;";

一些注意事项

出于安全原因,只要有可能,SafeFrame 是投放广告的首选方式。 SafeFrame 提供了一个 API 来与父窗口通信,但不允许完全访问。 SafeFrame 包含一个用于增加 iFrame 大小的扩展选项,但是,DFP 的 SafeFrame 实现似乎不允许您扩展到全屏。 出于这个原因,最好为插页式广告使用友好的 iFrame。 您可以在此处试用 DFP 的 SafeFrame 实施。

请注意,您应该只允许您完全信任的内容在 Friendly iFrame 中运行,因为它可以做很多恶意的事情(例如窃取用户会话 cookie 等)。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM