Create a new file

To create a new expandable ad:

1. Select File > New... from the top menu.

   

2. In the "Create New Blank File" dialog, choose Expandable as the ad type.

3. Configure the following options:

   • Name - Give the ad a name. This will be the name of the HTML file.

   • Location - Choose where you want to save the file. You can save your file locally on your computer.

   • Environment - Select the ad environment where you want the ad to run. For expandable ads, Google Web Designer supports the Display & Video 360 environment, and also lets you create a generic file that isn't environment-specific. The Google Ads and Google AdMob environments aren't supported for expandable ads.

   • Dimensions - Either set the dimensions for the ad if you know the specific size you need, or check Responsive layout to create an ad that automatically adjusts its size to match the viewport or ad slot it's displayed in. Common banner and expandable sizes are listed in their respective dropdown lists. If you want to use a different size, select Custom from the dropdown, then enter the width and height.

   • Expansion Mode - Set the expansion mode. Choose Default to expand to the dimensions you've set. Choose Responsive layout to let the ad expand to fit the ad slot size. Choose Fullscreen Lightbox when you're using a lightbox ad in Studio.

     When you're creating an ad for a specific screen size, the simplest solution is to create an ad with specific dimensions, and leave Responsive layout unchecked.

     When you want to create an HTML page or ad that will work well for many different sizes, and you're not designing for a specific screen size, you should use a responsive layout. A responsive layout uses media queries to recognize different viewport orientations and to change layout rules to restyle the document to fit them.

   • Animation mode - Select the animation mode that you want to use initially (you can switch at any time). Quick mode lets you animate your ad scene by scene, while Advanced mode lets you animate individual elements on their own timeline.

4. Click OK.