Parallax creatives

animation of scrolling to a Parallax ad

Parallax is a beautiful, immersive display format designed for mobile web. It leverages a layered, parallax animation effect to capture attention in an interesting and non-intrusive way. The format creates a unique perception that different image layers of the ad have different depths. As the viewer scrolls through content on their phone, the ad is fully revealed.

Benefits

  • Interactive ad experience that draws potential customers to engage with the ad while giving them complete control on how they engage with it
  • Run these ad experiences at-scale across publishers on mobile web
  • Completely customize and differentiate your ad experience using Google Web Designer

Inventory

Parallax is currently only eligible on Ad Manager inventory. Parallax teases users through a cool scroll-based interaction, and as such, it is designed for below-the-fold inventory.

Find inventory

To determine the volume of parallax impressions available:

  1. Create an Inventory Availability report.
  2. Add Creative Attributes as a filter. A sub-filter menu appears to the right.
    1. In the sub-filter menu, click + add then select Parallax.
    2. Click Done.
  3. Click Save and run to create a report.

Set up line item targeting

When you set up targeting, target smartphone inventory that's below-the-fold.

Use the following settings to target eligible inventory:

  • Viewability: Active view - All impressions (greatest reach)
  • Position: Below the fold

Build a parallax creative

Design your creative using Google Web Designer

To get started designing your parallax ad, open Google Web Designer and drag the Parallax component to the stage. 

Don't have Google Web Designer? It's a free desktop app that helps you design and build HTML5 creatives for Display & Video 360. Download Google Web Designer

Start from a layout

To get some inspiration or to get a jump start on your creative design, you can open one of the following pre-built layouts in Google Web Designer. To find them, open Google Web Designer, then select Use template. The Template Gallery will open. From there, select Parallax for Display & Video 360, then select one of the following layouts:

  • Parallax Reveal
  • Parallax Particles
  • Parallax Lockup

Add an exit

Make sure to add at least one button or hotspot a consumer can click to go to your advertiser landing page. To add an exit, use Google Web Designer's Tap Area component. No custom code is required.

  1. Be sure your ad has a button or other clear visual call-to-action element for the user to click or touch.
  2. Drag the Tap Area component from the Interaction folder of the Components panel to the stage, and position it over the call to action.
  3. Click the new event button  in the Events panel.
  4. In the event dialog, select the following options:
    Target The Tap Area component (gwd-taparea_1)
    Event Tap Area > Touch/Click
    Action

    Google Ad > Exit ad

    Note: A similar action, Exit ad (overrides URL), doesn't allow you to modify the URL outside of the creative, such as within Studio or Campaign Manager 360, and should only be used for dynamic ads.

    Receiver gwd-ad
    Configuration
    • Metrics ID - A label (e.g., "CTA") to make reports easier to understand.
    • URL - The exit URL.
    • Collapse on exit - For expandable ads, check to collapse the ad when the user closes the ad.
    • Pause media on exit - Check to stop video and audio playback when the user closes the ad.
    • Collapsed page on exit - For expandable ads, the page to show when the user closes the ad.

Upload your creative

When your creative is ready, you can either:

Parallax creatives must be either directly uploaded to Display & Video 360 or pushed to Display & Video 360 from Google Web Designer. If you upload a parallax creative to Campaign Manager 360 and sync it to Display & Video 360, the creative won't work properly.

Upload a locally published creative ZIP file

  1. Open an advertiser, then click Creatives in the left menu.

  2. Click New and then Upload and then HTML5 or image.

  3. Enter a name for the creative in Display & Video 360.

  4. To add your creative files, drag the published creative .zip file from your computer and drop it over "Drag file here". Or, click Upload, then select the .zip file from your computer. Learn what to include in HTML5 zip files
    Drag files to upload them

  5. (Optional) To add a backup image and backup reporting label, expand the Backup image panel.

  6. (Optional) Upload a polite load image. This image is shown when there are delays loading your primary creative files, or on slower network connections.

  7. In the Events section, review and edit the exits detected in the creative. For each exit (or click tag) you can edit the landing page URL, beginning with http:// or https://. To edit the reporting label or URL, hover over the row, then click Edit Edit.

    After you save the creative, it may take a few minutes for an updated landing page to appear in preview or in your synced Campaign Manager 360 advertiser.

  8. (Optional) If the Display & Video 360 advertiser is linked to a Campaign Manager 360 account, add a tracking ad to get reporting in your Campaign Manager 360 advertiser.
    1. Click Serving properties.
    2. Search for an existing Campaign Manager 360 tracking ad. To give it time to sync, you should create a tracking ad in Campaign Manager 360 before making your creative in Display & Video 360.

      Tip: To make it easier to find the right tracking ad, assign only 1 tracking ad per ad and placement in Campaign Manager 360.
  9. (Optional) Click Additional details to append a tracking tag to the creative, add an integration code, or notes.

  10. Save your creative.

Display & Video 360 manually and automatically reviews your creatives to make sure they work. Creatives are also checked to make sure they comply with Google's ad policies and the policies of exchanges they can serve on. You can check the status of your creatives in the Creative status tab.

Publish from Google Web Designer

When you publish directly from Google Web Designer, the creative is saved as a draft. To assign it to active line items, you need to also publish the creative in Display & Video 360.

Publish a Google Web Designer creative in Display & Video 360

  1. Open your advertiser in Display & Video 360.
  2. In the left menu, click Creativesand thenCreative.
  3. Search or filter to find the creative you want to publish, then click the creative's name to open it.
  4. In the Basic details section, confirm that the creative asset's status is set to "Publish".
  5. (Optional) To add a backup image and backup reporting label, expand the Backup image panel.

  6. (Optional) Upload a polite load image. This image is shown when there are delays loading your primary creative files, or on slower network connections.

  7. In the Events section, review and edit the exits detected in the creative. For each exit (or click tag) you can edit the landing page URL, beginning with http:// or https://. To edit the reporting label or URL, hover over the row, then click Edit Edit.

  8. (Optional) Click Additional details to append a tracking tag to the creative, add an integration code, or notes.

  9. Save your creative.

How to serve parallax creatives

If you're a publisher or exchange who's looking to serve Parallax creatives, the only requirement is that you have below-the-fold inventory that uses Google Publisher Tags, which allows the creative to respond to scroll events.

Was this helpful?

How can we improve it?

Need more help?

Try these next steps:

true
2024 Privacy Readiness guide

Prepare for a world without third-party cookies and unlock the AI
opportunity by adopting the right durable audience and measurement
solutions.
Start Today

Search
Clear search
Close search
Google apps
Main menu
1331383399996871121
true
Search Help Center
true
true
true
true
true
69621
true
false