Add DFP DoubleClick inside a Facebook Instant article

How can I add an DFP ad inside a Facebook Instant article? I use the DoubleClick service.

I need to know an example of what should I add inside the 'figure':

<figure class="op-ad">
    <!-- Use this for your ads -->
    <iframe src="https://www.adserver.com/ss;adtype=banner320x50" height="50" width="320"></iframe>
</figure>

Thanks

I recommend using Doubleclick's GPT tag but with the caveat of placing the whole ad tag within the iFrame (as opposed to making calls to the head element). An example can be found below:

<figure class="op-ad"><iframe height=“250" style="border:0;margin:0;padding:0;" width="300”>
<script type="text/javascript">
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];
(function() {
var gads = document.createElement(“script”);
gads.async = true;
gads.type = “text/javascript”;
var useSSL = “https:” == document.location.protocol;
gads.src = (useSSL ? “https:” : “http:”) +
“//www.googletagservices.com/tag/js/gpt.js” (http://www.googletagservices.com/tag/js/gpt.js%E2%80%9D);
var node = document.getElementsByTagName(“script”)[0];
node.parentNode.insertBefore(gads, node);
})();
</script><script type="text/javascript">
googletag.cmd.push(function() {
googletag.defineSlot("/1234/travel/asia/food", [[300, 250]], "div-gpt-ad-123456789-1").addService(googletag.pubads()).setTargeting(“abc”, “xyz”).setTargeting(“123”, “456”);
googletag.pubads().collapseEmptyDivs();
googletag.enableServices();
});
</script><div id="div-gpt-ad-123456789-1">
<script type="text/javascript">
googletag.cmd.push(function() { googletag.display(“div-gpt-ad-123456789-1”); });
</script></div>
</iframe>
</figure>

AdPlugg allows you to do this. Your code above would become:

<figure class="op-ad">
    <!-- Use this for your ads -->
    <iframe src="http://www.adplugg.com/serve/<your_adplugg_access_code>/html/1.1/index.html?zn=fb_zone_1" height="50" width="320"></iframe>
</figure>

Then from inside your AdPlugg account, you would drop in your tag from Google. You could also then rotate in affiliate network ads, your own direct buy ads, etc.

That should be all that you need but if you want, you can read more about how to set up Facebook Instant Article ads in a blog that I posted: Facebook Instant Article Ads.

Disclaimer: I work for AdPlugg.

Prepare a DFP integration static HTML file by using GPT like seen below:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}</style>
<script type="text/javascript">
  (function() {
    var useSSL = 'https:' == document.location.protocol;
    var src = (useSSL ? 'https:' : 'http:') +
        '//www.googletagservices.com/tag/js/gpt.js';
    document.write('<scr' + 'ipt src="' + src + '"></scr' + 'ipt>');
  })();
</script>
<script type="text/javascript">
    googletag.defineSlot('/YOUR_DFP_ACCOUNT_NUMBER/YOUR_ADUNIT_CODE', [300, 250], 'div-gpt-ad-1459514019072-0').addService(googletag.pubads());    
    googletag.enableServices();
</script>

</head>

<body>
<div id="div-gpt-ad-1459514019072-0">
    <script type="text/javascript">
        googletag.display('div-gpt-ad-1459514019072-0');
    </script>
</div>
</body>

</html>

Save and host it somewhere like http://example.com/fbia-banner.html

And now call this URL by using Facebook Instant Article (FBIA) ad syntax :

<figure class="op-ad">
    <iframe height="250" width="300" src="http://example.com/fbia-banner.html"></iframe>
</figure>

And test whole page code by using FBIA test tools.

Notes:

Using a proxy file like this solution isnot the best solution, it would be better if there was a direct DFP URL to serve. I tried DFP simplified url tags but it's not suitable to use in FBIA

Facebook complains about having "width" and "height" attributes on iframe tags, you should remove them.

来源：https://stackoverflow.com/questions/36290852/add-dfp-doubleclick-inside-a-facebook-instant-article

标签

facebook

ads

google-dfp

facebook-instant-articles