google-dfp - Google DFP - SafeFrame 展开式广告

Question

好像这个问题以前有人问过，没有答案。我正在尝试使用 Google Dfp 和 SafeFrame API 实现重叠式广告。我让 Google 控制台报告广告正在 SafeFrame 中提供，但没有检索到任何状态，$sf.ext.register 回调被触发。看起来 $sf.ext.expand 永远不会像 $sf.ext.register 那样触发。

我已将广告创意中的设置更改为转换到 iframe 中，并且我正在使用以下 dfp 标记。

var sticky_image = document.getElementById('sticky-footer__image');
var sticky_image_expanded = 'http://www.example.com/image.jpg'
var sticky_image_collapsed = sticky_image.src;
var sticky_container = document.getElementById('sticky-footer__container');

function adjustDivContainerSize() {
  var self = $sf.ext.geom().self;
  sticky_container.style.width = (self.r - self.l) + 'px';
  sticky_container.style.height = (self.b - self.t) + 'px';
}

function expandAd() {
  /**
   * Expand the ad by calling the SafeFrame API
   */
  var config = {
    push: false,
    t: 250,
    l: 0,
    r: 0,
    b: 0
  };
  $sf.ext.expand(config);
  adjustDivContainerSize();
}

function collapseAd() {
  $sf.ext.collapse();
  adjustDivContainerSize();
}

adjustDivContainerSize();

/**
 * Register the original ad size
 */
$sf.ext.register(300, 70, function(status, data) {
  if (status == "expanded") {
    //nothing fires
  } else if (status == "collapsed") {
    //nothing fires
  }

});

sticky_container.style.height = '100%';

sticky_container.addEventListener('mouseover', function() {
  sticky_image.src = sticky_image_expanded;
  expandAd();
})

sticky_container.addEventListener('mouseout', function() {
  sticky_image.src = sticky_image_collapsed;
  collapseAd();
});

具有讽刺意味的是，我的代码段在使用创意预览工具时有效。 http://publisherconsole.appspot.com/safeframe/creative-preview.html

Answer 1

您遗漏了 expandAd() 中的一部分功能。您需要设置 config变量到允许的扩展大小。复制了相关部分并添加了所需的代码。

    function expandAd() {
      /**
       * Expand the ad by calling the SafeFrame API
       */
      var allowedExp = $sf.ext.geom().exp;
      var config = {
        push: false,
        t: 250,
        l: 0,
        r: 0,
        b: 0
      };
      /*config.t = allowedExp.t; set in config initialisation*/
      config.l = allowedExp.l;
      config.r = allowedExp.r;
      config.b = allowedExp.b;
      $sf.ext.expand(config);
    }

希望这会有所帮助。