How to properly write a DFP out of page ad unit?

After consulting with DFP support, I was able to create an out of page interstitial ad unit by following these steps:

  1. Create a new Ad Unit, with inventory size of "Out of Page"
  2. Create a new Line Item and a mobile creative with inventory size "Out of Page", this line item targets the former Ad Unit.
  3. Generate new tags under the Inventory tabs, selected "Enable synchronous requests" and "Out of Page" on step 2. The "Enable synchronous requests" seems to be the key to make this work.

    According to Google Support:

    We usually recommend our publishers to implement Sync GPT when serving out of page (interstitial) ads as the creative renders in a element instead of an iFrame

  4. Place this tag in a test page (with the necessary html, head and body tags) and Voilà!


Not sure this is what you need, and I don't have that much experience with DFP, but I just ran into a similar problem that I solved by managing the size of the iframe manually. Maybe this can help you too.

The DFP API has an event you can listen to that lets you know that the ad has finished rendering, upon which I would suggest you change the iframe properties to be full width, and a whatever height would work for the placement.

Assuming you have jQuery on your page, this can be done quite easily. After setting up the DFP plugin (calling defineSlot etc.) you can add a listener for this event like so:

googletag.pubads().addEventListener('slotRenderEnded', function(){
  var $adFrame = $('#id-of-the-iframe');
  $adFrame.css({width: '100%', height: '500px'});
});

This is outlined in DFP docs here.

Hope this helps.

EDIT: After posting I realized that the code example I posted is from the DFP GPT library. Perhaps you are not using this. This SO question has a link to a library that someone has created to listen to events that DFP fires. Perhaps you can use that and use the technique I described?

Again - hope this helps :)