DoubleClick for publishers：指定浏览器和广告尺寸

我试图根据浏览器大小加载横幅。因此，在我拥有728x90横幅的位置，300x250会显示它是否在移动设备上。DoubleClick for publishers：指定浏览器和广告尺寸

问题是，728x90在桌面上加载。但在移动300x250不显示。

我尝试下面的例子here

<script type='text/javascript'> 
googletag.cmd.push(function() { 
    // This mapping will only display ads when user is on desktop sized viewport 
    var mapLeader = googletag.sizeMapping(). 
     addSize([0, 0], []). 
     addSize([768, 200], [728, 90]). 
     build(); 

    // This mapping will only display ads when user is on mobile or tablet sized viewport 
    var mapLeader2 = googletag.sizeMapping(). 
     addSize([0, 0], []). 
     addSize([768, 200], []). // Desktop 
     addSize([300, 200], [300, 250]). // Tablet 
     build(); 

    window.LeaderSlot= googletag.defineSlot('/XXXXXXX/leaderboard-1', [728, 90], 'div-gpt-ad-1455251022145-0'). 
     defineSizeMapping(mapLeader). 
     setCollapseEmptyDiv(true). 
     addService(googletag.pubads()); 

    window.LeaderSlot= googletag.defineSlot('/XXXXXXX/medium-rectangle-1', [300, 250], 'div-gpt-ad-1458546777123-0'). 
     defineSizeMapping(mapLeader2). 
     setCollapseEmptyDiv(true). 
     addService(googletag.pubads()); 

    googletag.pubads().enableSingleRequest(); 
    googletag.pubads().enableSyncRendering(); 
    // Start ad fetching 
    googletag.enableServices(); 

}); 
</script>

，并在我的HTML

<!-- /XXXXXX/leaderboard-1 --> 
<div id='div-gpt-ad-1455251022145-0' style='height:90px; width:728px;' class="center"> 
    <script type='text/javascript'> 
     googletag.cmd.push(function() { googletag.display('div-gpt-ad-1455251022145-0'); }); 
    </script> 
</div> 
<!-- /XXXXXX/medium-rectangle-1 --> 
<div id='div-gpt-ad-1458546777123-0' style='height:250px; width:300px;'> 
    <script type='text/javascript'> 
    googletag.cmd.push(function() { googletag.display('div-gpt-ad-1458546777123-0'); }); 
    </script> 
</div>

我一定把<div>为每个尺寸在同一个位置？我如何获得300x250横幅加载？ 728x90工作正常。我知道我可以隐藏/显示浏览器的大小，使用CSS。但我不想这样做。在同一位置加载多个尺寸会减慢我的网站加载速度。

来源

2016-03-21 user2636556

也许它与'window.LeaderSlot'有关？在这个例子中是一个数组，在这里你只有一个你正在替换的变量。 – jolmos

您不需要style='height:90px; width:728px;'，因为您希望DFP根据屏幕大小加载适当的横幅。

<!-- /XXXXXX/leaderboard-1 --> 
<div id='div-gpt-ad-1455251022145-0' style='height:90px; width:728px;' class="center"> 
    <script type='text/javascript'> 
     googletag.cmd.push(function() { googletag.display('div-gpt-ad-1455251022145-0'); }); 
    </script> 
</div>

当你使用不同的屏幕尺寸测试您的浏览器，请记住，横幅不会自动调整大小。您将不得不刷新页面以查看更改。

来源

2016-04-04 06:10:50

我真的没有机会保存你提供的例子，所以我创建了一个例子，它为我完美工作。我会在底部稍微解释一下。

<html> 
     <head> 
     <title>Async Responsive</title> 
     <script async src="http://www.googletagservices.com/tag/js/gpt.js"> 
     </script> 
     <script> 
      googletag = window.googletag || {cmd:[]}; 
      googletag.cmd.push(function() { 

      var sizeMapping = googletag.sizeMapping(). 
       addSize([1024, 768], [970, 250]). // Screens of any size smaller than infinite but bigger than 1024 x 768 
       addSize([980, 690], [728, 90]). // Screens of any size smaller than 1024x 768 but bigger than 980 x 690 
       addSize([640, 480], [120, 60]). // Screens of any size smaller than 980 x 690 but bigger than 640 x 480 
       addSize([0, 0],  [88, 31]). // Screens of any size smaller than 640 X 480 but bigger than 0 x 0 

       build(); 

      googletag.defineSlot(
       '/XXXXXX/ad-unit-inside-dfp/level2/level3', [320, 50], 'div-id'). 
       defineSizeMapping(sizeMapping). 
       addService(googletag.pubads()); 

      googletag.enableServices(); 
      }); 
     </script> 
     </head> 
     <body> 
     <h1>user2636556 Testpage</h1> 
     <div id="div-id"> 
      <script> 
      googletag.cmd.push(function() { googletag.display('div-id') }); 
      </script> 
     </div> 
     </body> 
</html>

首先你必须调用.sizeMapping（）的广告尺寸映射到浏览器尺寸，然后你需要调用.defineSizeMapping（）来实现的映射。

您为addSize指定的第一个尺寸是屏幕尺寸，每个后续尺寸都是广告尺寸。例如，在上面定义的第一个addSize（）中，[1024,768]是浏览器大小，[970,250]是广告大小。

如果映射中存在错误或无法确定屏幕尺寸，则会使用.defineSlot（）中指定的尺寸。

GPT自适应广告不会调整浏览器大小的变化。您可以添加自己的自定义代码来刷新调整大小的广告位。

为了这个功能是这一个：

googletag.pubads().refresh();

如果有任何进一步的问题，让我知道吧。

来源

2016-03-31 16:28:05 AppRoyale

DoubleClick for publishers：指定浏览器和广告尺寸

回答

相关问题