DFP动态加载广告代码

自动摘要

正在生成中……

<script>
var isMobileBrowser = typeof jQuery.browser.mobile !== 'undefined' && jQuery.browser.mobile;

var adSlotClass = 'ad-slot',
  lrecClass = 'lrec',
  leaderboard1Class = 'leaderboard1',
  halfpage1Class = 'halfpage1',

  itemSelector = '.articleCols > .container > .row';
  pageSelector = '._page_',
  adSlotSelector = '.ad-slot',
  leaderboard1ContainerSelector = '.leaderboard1-container',
  halfpage1ContainerSelector = '.halfpage1-container',

  lrecAdUnitCode = '/14112232/Madamefigaro_Article_LREC1',
  leaderboard1AdUnitCode = '/14112232/Madamefigaro_Article_Leaderboard1',
  halfpage1AdUnitCode = '/14112232/Madamefigaro_Article_Halfpage1',

  lrecTemplate = '<div class="adModule d-block d-lg-none" style="margin:24px -18px; min-height: 283px;">'+
    '<div class="subHd">Advertisement</div>'+
    '<div class="'+adSlotClass+' '+lrecClass+'" id="{{id}}" data-ad_index="{{index}}"></div>'+
    '</div>',
  firstLeaderboard1Template = '<div class="adModule adModule-top d-none d-lg-block">'+
    '<div class="subHd">Advertisement</div>'+
    '<div class="'+adSlotClass+' '+leaderboard1Class+'" id="{{id}}" data-ad_index="{{index}}"></div>'+
    '</div>'+
    '<div class="adModule-placeholder d-none d-lg-block"></div>',
  leaderboard1Template = '<div class="adModule d-none d-lg-block">'+
    '<div class="subHd">Advertisement</div>'+
    '<div class="'+adSlotClass+' '+leaderboard1Class+'" id="{{id}}" data-ad_index="{{index}}"></div>'+
    '</div>',
  halfpage1Template = '<div class="adModule stickyAd d-none d-lg-block">'+
    '<div class="subHd">Advertisement</div>'+
    '<div class="'+adSlotClass+' '+halfpage1Class+'" id="{{id}}" data-ad_index="{{index}}"></div>'+
    '</div>',

  slots = [];

var lrec_sizes = [
  [320, 480], [300, 250]
];
var leaderboard_sizes = [
  [970, 250], [970, 90], [728, 90]
];
var halfpage_sizes = [
  [300, 600], [300, 250]
];

/* DFP start */
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];

(function($){
  var waypointRefreshAllTimer;
  $(window).on('waypoint.refreshAll', function(event){
    clearTimeout(waypointRefreshAllTimer);
    waypointRefreshAllTimer = setTimeout(function(){
      Waypoint.refreshAll();
    }, 0);
  });

  googletag.cmd.push(function(){
    googletag.pubads().addEventListener('slotRenderEnded', function(e){
      $(window).trigger('waypoint.refreshAll');
    });
  });

  $(window).on('page.enter', function(event, $page, direction){
    $page.find(adSlotSelector).each(function(){
      $(this).css('height', '');
    });

    if(jQuery(window).width() < 992) {
      if(typeof googletag !== 'undefined'){
        googletag.cmd.push(function(){
          var pageNumber = $(pageSelector).index($page)+1;
          if(pageNumber < $(pageSelector).length){
            var $lrec = $page.find('.'+lrecClass);
            if($lrec.length > 0){
              var slotsToRefresh = [];
              $lrec.each(function(){
                if($(this).is(':empty')){
                  var id = $(this).attr('id'),
                    index = $(this).data('ad_index');
                  slots[index] = googletag.defineSlot(lrecAdUnitCode, lrec_sizes, id)
                    .setTargeting('post_id', $(itemSelector).data('post_id'))
                    .setTargeting('pageNumber', pageNumber)
                    .addService(googletag.pubads());
                  googletag.display(slots[index]);
                  slotsToRefresh.push(slots[index]);
                }
              });
              if(slotsToRefresh.length > 0){
                refreshBid(slotsToRefresh);
              }
            }else{
              var id = 'div-gpt-ad-'+Math.floor(Math.random()*10000000000000)+'-0',
                index = slots.length;
              $page.append(Mustache.render(lrecTemplate, {
                id: id,
                index: index
              }));
              slots[index] = googletag.defineSlot(lrecAdUnitCode, lrec_sizes, id)
                .setTargeting('post_id', $(itemSelector).data('post_id'))
                .setTargeting('pageNumber', pageNumber)
                .addService(googletag.pubads());
                googletag.display(slots[index]);
              refreshBid([slots[index]]);
            }
          }
        });
      }
    }
  });

  $(window).on('article.enter', function(event, $item, direction){
    if (jQuery(window).width() >= 992) {
      if(typeof googletag !== 'undefined'){
        googletag.cmd.push(function(){
          /* leaderboard1 start */
          var itemIndex = $(itemSelector).index($item),
            $leaderboard1 = $('.'+leaderboard1Class+':eq('+itemIndex+')');
          if(itemIndex>0){
            $(leaderboard1ContainerSelector+':eq('+itemIndex+')').css({
              'width':'100%',
              'max-height':'283px'
            });
          }
          if($leaderboard1.length > 0){
            var slotsToRefresh = [];
            if($leaderboard1.is(':empty')){
              var id = $leaderboard1.attr('id'),
                index = $leaderboard1.data('ad_index');
              slots[index] = googletag.defineSlot(leaderboard1AdUnitCode, leaderboard_sizes, id)
                .setTargeting('post_id', $item.attr('id').replace(/^post\-/, ''))
                .addService(googletag.pubads());
              googletag.display(slots[index]);
              slotsToRefresh.push(slots[index]);
            }
            if(slotsToRefresh.length > 0){
              refreshBid(slotsToRefresh);
            }
          }else{
            var id = 'div-gpt-ad-'+Math.floor(Math.random()*10000000000000)+'-0',
              index = slots.length;
            $(leaderboard1ContainerSelector+':eq('+itemIndex+')').append(Mustache.render((itemIndex == 0 ? firstLeaderboard1Template : leaderboard1Template), {
              id: id,
              index: index
            }));
            slots[index] = googletag.defineSlot(leaderboard1AdUnitCode, leaderboard_sizes, id)
              .setTargeting('post_id', $item.attr('id').replace(/^post\-/, ''))
              .addService(googletag.pubads());
            googletag.display(slots[index]);
            refreshBid([slots[index]]);
          }
          /* leaderboard1 stop */

          /* halfpage1 start */
          $item.find(halfpage1ContainerSelector).each(function(){
            var $container = $(this);
            if($container.find('.'+halfpage1Class).length > 0){
              var slotsToRefresh = [];
              $container.find('.'+halfpage1Class).each(function(){
                if($(this).is(':empty')){
                  var id = $(this).attr('id'),
                    index = $(this).data('ad_index');
                  slots[index] = googletag.defineSlot(halfpage1AdUnitCode, halfpage_sizes, id)
                    .setTargeting('post_id', $item.attr('id').replace(/^post\-/, ''))
                    .addService(googletag.pubads());
                  googletag.display(slots[index]);
                  slotsToRefresh.push(slots[index]);
                }
              });
              if(slotsToRefresh.length > 0){
                refreshBid(slotsToRefresh);
              }
            }else{
              var id = 'div-gpt-ad-'+Math.floor(Math.random()*10000000000000)+'-0',
                index = slots.length;
              $container.append(Mustache.render(halfpage1Template, {
                id: id,
                index: index
              }));
              slots[index] = googletag.defineSlot(halfpage1AdUnitCode, halfpage_sizes, id)
                .setTargeting('post_id', $item.attr('id').replace(/^post\-/, ''))
                .addService(googletag.pubads());
              googletag.display(slots[index]);
              refreshBid([slots[index]]);
            }
          });
          /* halfpage1 stop */
        });
      }
    }
  });

  $(window).on('article.exited', function(event, $item, direction){
    var slotsToDestroy = [];

    var itemIndex = $(itemSelector).index($item),
      $leaderboard1 = $('.'+leaderboard1Class+':eq('+itemIndex+')'),
      index = $leaderboard1.data('ad_index');
    slotsToDestroy.push(slots[index]);
    slots[index] = null;
    
    $item.find(adSlotSelector).each(function(){
      var adHeight = $(this).height(),
        index = $(this).data('ad_index');
      $(this).css('height', adHeight);
      slotsToDestroy.push(slots[index]);
      slots[index] = null;
    });

    googletag.cmd.push(function(){
      googletag.destroySlots(slotsToDestroy);
      $(window).trigger('waypoint.refreshAll');
    });
  });
})(jQuery);

//var special1Slot, leaderboardSlot, halfpageSlot;
var special1Slot;

googletag.cmd.push(function() {
  special1Slot = googletag.defineSlot('/14112232/Madamefigaro_ROS_Special1', [1, 1], 'div-gpt-ad-1569492884143-0').addService(googletag.pubads());
  /*
  //if (!isMobileBrowser) {
  if (jQuery(window).width() >= 992) {
    leaderboardSlot = googletag.defineSlot('/14112232/Madamefigaro_Article_Leaderboard1', leaderboard_sizes, 'div-gpt-ad-1566901802853-0').addService(googletag.pubads());
    halfpageSlot = googletag.defineSlot('/14112232/Madamefigaro_Article_Halfpage1', halfpage_sizes, 'div-gpt-ad-1566901802853-2').addService(googletag.pubads());
  }
  */
  googletag.pubads().setTargeting('ad_set', (Math.floor(Math.random()*4)+1).toString());
  googletag.pubads().enableSingleRequest();
  googletag.pubads().disableInitialLoad();
  googletag.enableServices();
});

function refreshBid(slotsToRefresh) {
  googletag.cmd.push(function() {
    googletag.pubads().refresh(slotsToRefresh);
  });
}
/* DFP stop */

示例页面：https://www.madamefigaro.hk/15581/fashion/%e6%99%82%e8%a3%9d%e9%80%b1%e7%ad%86%e8%a8%98-pfw-%e6%87%b6%e4%ba%ba%e5%8c%85/