Google DFP - 从内部调整 SafeFrame 自定义创意外部 iframe 容器的大小(展开广告) [英] Google DFP - Resize SafeFrame custom creative outer Iframe container from inside (expand ad)

问题描述

我正在寻找可以从 Google DFP 中的自定义广告素材内部扩展 SafeFrame 自定义广告的解决方案，这有可能吗?

解决方案

有两种可能的解决方案:

1) 使用 SafeFrame API

优点:

• 您可以开箱即用"使用它
• 您可以在任何网站上使用它，不需要网站上的自定义代码
• 使用起来很安全

缺点:

• 它仅限于填充网站的可见区域
• 需要等待，直到用户可以看到广告单元

2) 使用 window.postMessage() javascript 方法

编写您自己的 API

缺点:

• 您需要向您的网站添加自定义代码
• 如果您使用某些第 3 方广告素材，这可能是一种威胁

优点:

• 您几乎可以通过您的广告素材在您的网站上做任何事情

1) 使用 SafeFrame API

这个API真的很容易使用，你可以在GPT Safeframe 预览工具.

首先，您需要更新您网站 中的 DFP 初始化脚本

var pageConfig = {allowOverlayExpansion: 真,allowPushExpansion: 真,沙盒:真实};googletag.pubads().setSafeFrameConfig(pageConfig);

这将允许在您的网站上扩展 SafeFrame 广告.更多关于这个在通过 GPT 控制 SafeFrame 容器行为.

现在您可以创建自定义广告素材并将其作为 SafeFrame 投放到您的网站上.这是我的一个例子.这个例子可以等待"util它是可见的，然后将扩展到<div id="container">的高度，它在SafeFrame里面:

一些用于制作容器高度的线条<br>线
线
线
线
线
线
线
线
线
线
线
线
线
线
线
线
线
<脚本>//全局扩展指标变量，因为 API 没有任何var 扩展 = 假；函数展开(){var self= $sf.ext.geom().self;变量配置 = {push: true,//我们要推送扩展的内容乙:0};var el = document.getElementById('容器');var containerHeight = el.offsetHeight;//从底部获取需要扩展的高度var expandBottom = containerHeight - self.h;//如果容器在 SafeFrame 内是完整的，则不会展开if(expandBottom <0) 返回；config.b = expandBottom;$sf.ext.expand(config);}函数 expandDelayed(forceExpand) {//expand 只运行一次，或者你可以强制它再次运行//但需要先折叠if(expanded && forceExpand || !expanded) {$sf.ext.collapse();扩展 = 假；//必须有一些超时，因为 .collapse();方法以某种方式显示设置超时(展开，0)；}}$sf.ext.register(160, 150, function(status, data) {//这段代码会等待"合适的时机如果(状态 === 'geom-update'){展开延迟()；}//改变全局展开状态如果(状态 === '扩展'){扩展 = 真；}});//在里面展开延迟()；

2.使用 window.postMessage() javascript 方法

编写您自己的 API

首先，您需要将此代码放入您网站 中的 DFP 初始化脚本中.此代码会将作为 #hash-tag 的广告位 ID 添加到