Responsive Layout Banner Template

Responsive Layout Banner is the onpage responsive template to create pop-ups for your website.

How to create it

To create an on page responsive web campaign,

1. Navigate to Experience > Optimize > Web Templates.

2. Click the Create button on the listing page and enter your campaign name in the text area. Then, click Next to proceed.

3. When you land on the Template Library, you can search for the template, find it under Increase Conversion Rate objective or filter cross-platform templates to start creating campaigns on Responsive Suite. 

4. When you click on the template, you see its objective, description and elements. Click on Use for Cross Platform to design your template.

To configure the settings of the rest of your campaign, you can refer to Anatomy of Responsive Web Suite.

How to create a Pop Up campaign

If you want to create a pop up campaign using the responsive layout banner template, follow the steps below.

1. Once you land on the Action Builder, you will see the Remove All Elements option on the right menu. When you click the Remove All Elements button, a warning modal will appear to make sure you are acknowledged about what happens when you click on this option.

Click the Remove button on the modal to enable the removal of all elements on the canvas. 

2. After you click it, you will see everything on the canvas are deleted. 

To upload the image you want for your pop up, double-click on your template or click the Add Image button on the right menu.

When you click the OK button and upload the image, you will see that your template will be autoresized for each platform dynamically based on the correlation between the image’s size and platform’s predefined container size. You can adjust the size of your pop up campaign on the right menu or click on the canvas and drag and drop the lines around the template. 

To see how your pop up campaign will look like in each platforms, click the platform iconsin the top bar. 

3. When you switch to the Preview tab, you will see everything looks properly for mobile, desktop and tablet. Depending on your choice of device, your pop up autoresizes itself. 

4. When needed, using the Size menu in the top bar, you can change the size of your pop up in terms of height and width. 

5. If you want to include any other element such as countdown, button, text etc. on the image on your design, hover on the layout and click the plus (+) buttons that appear to edit your template. When you choose the element, you can also customize its design as usual.

6. If you want to rearrange everything for your pop up and start from scratch, click on Responsive Layout Banner on the left menu to see Remove All Elements option again. When you click on it, everything will be removed on your canvas to provide you a blank page. 

7. When you complete your design, save it and continue with the rest of your campaign.