HTML5 expanding pushdown build guide

A pushdown creative is an expanding ad that pushes down the content of a webpage when the creative expands, moving the site out of the way to display the ad. Pushdown creatives are browser-only and can't be served in mobile apps.

Stylized before (labeled A) and after (labeled B) image of a rectangular ad pushing down entire page content

A pushdown is built exactly the same way as an expanding creative. The "pushdown" setting is enabled in Campaign Manager 360 Trafficking or Google Ad Manager.

To get a jump start on your creative, open a pushdown starter file in Google Web Designer.

Make a pushdown creative

  1. Start by building an expanding creative. Learn how in our expanding build guides for Google Web Designer or HTML5.
  2. (Optional) Add code to automatically expand the creative after the page is loaded:
    Expand automatically in Google Web Designer
    1. Click Code view.
    2. Scroll down to the script tag with the ID gwd-init-code:
      <script type="text/javascript" id="gwd-init-code">
    3. Look for the function called handleAdInitialized. Inside the function, add the following code:
      setTimeout(function() {
        Enabler.requestExpand();
        gwd.actions.gwdGoogleAd.goToPage(
            'gwd-ad', 'expanded-page', 'push', 1000, 'linear', 'top');
      }, 500);
    Expand automatically in HTML5
    1. Before or after you initialize the Enabler, add the following code to avoid tracking the initial automatic expansion:
      Enabler.setStartExpanded(true);
    2. After the page and your creative assets are loaded, expand the ad with the requestExpand method:
      Enabler.requestExpand();

      Learn more

Best practices for automatically expanding pushdown creatives

If your pushdown is automatic, most publishers prefer to limit showing this type of creative to a person once per day. Afterward that person will only see other creatives in that ad rotation. This is called a frequency cap. In this case, it's best to build two creatives to serve in the same rotation: an auto-expanding version, and a version that requires a user click to expand.

Auto-expand

  • Follow the steps above, including the automatic expansion code.
  • Add "_AUTO" to the end of the creative's name to make it easy for traffickers to identify which creative is which.

User-initiated

  • Build an expanding creative using the same creative assets as the automatically expanding version. The creative should require a user to interact before expanding.
  • Add "_USER" to the end of the creative's name to make it easy for traffickers to identify which creative is which.

Was this helpful?

How can we improve it?

Need more help?

Try these next steps:

Search
Clear search
Close search
Main menu
12279919334977110399
true
Search Help Center
true
true
true
true
true
74220
false
false