Ensure creatives render within iframes

How to develop context-aware expandable and floating creatives

If you're using Google Publisher Tags (GPT) to serve expanding and floating ads, and the creative is larger than the ad slot, your creatives might be cut off. To make creatives compatible with iframes, the code for the creative needs conditional logic to detect and handle its environment.

Statically-sized creatives, such as a 728x90 banner, render correctly regardless of the existence of an iframe, because they do not require resizing of their container.

How a creative can detect its surroundings

Below is example creative code that detects if the creative is:

  1. Not served in an iframe
  2. Served in a friendly iframe and can escape
  3. Served in a cross-domain iframe and cannot escape
1 <script type="text/javascript">
2 if(top==self) {
3     ...

Lines 1-3: Not served in an iframe.
Since top is "self", the creative code detects that it hasn't been served in an iframe, so the expandable or floating ad creative can be directly written to the page using document.write() or another method.

4 } else {
5     try {
6        ...

Lines 4-6: Served in a friendly iframe and can escape.
Since top is not "self", the creative code detects that it needs to access the correct frame or window before adding the ad's HTML and JavaScript code to the page. The code will likely need to use DOM functions and reference the top window. If an error is encountered, the creative will move to the catch statement, below.

If the code is able to successfully reference the top window, the containing iframe is not a cross-domain iframe and considered "friendly".

7     } catch(e) {
8         ...
9     }
10 }
11 </script>

Lines 7-11: Served in a cross-domain iframe and cannot escape
If there was an error referencing the top window, the creative detects that it's in a cross-domain iframe and cannot escape. Here you can provide an alternative behavior so that the creative still renders in an acceptable manner. For example, you might display a statically-sized backup image instead of an expandable ad.

By default, Google Publisher Tags (GPT) use cross-domain iframes called SafeFrames to serve creatives. Use SafeFrame function calls to communicate with the parent page and resize itself. Learn how to render creatives using SafeFrame.

See code without tips
<script type="text/javascript">
   if(top==self) {
   } else {
       try {
       catch(e) {
Was this helpful?
How can we improve it?