How to Create Overlays for Mobile Devices

To create a mobile template using the Template Editor, follow these instructions: 

1. Under the Templates category on the left side of the dashboard, click on the Template Editor. Choose any type of template.

2. Change the html code according to your needs. In addition, in your html text, paste the line in the first line as you can see on the example below. You may change “height” and “width” values according to your needs. 

 

 

3. Click on CSS next to HTML button at the top of the html code. In your CSS code, paste the following code in the first line:

div.container {

width              : 300px;

height             : 400px;

}

You may change “height” and “width” values according to your needs.

4. The button closing the template must be coded in your template. Please, paste the line

X

in the first line of your html text. You can change the style of the button by pasting the following code in the first line of your CSS:

 

.close-x {

 color         : white;

 position      : absolute;

 top           : 6px;

 border-bottom : 1px dashed;

 font-size     : 14px;

 display       : inline;

 font-weight   : 100;

 font-style    : italic;

 cursor        : pointer;

}

5. Click the Save Template button to save your template. 

6. Under the Templates category on the left side of the dashboard, click on the Template List. Check Disable Close Button next to your created template. Please, see the example below. The close button must be coded in your template code as it was explained in step 4. 

 

 

8. Go to Campaigns category on the left side of the dashboard. Create a campaign following the instructions hereIn the right lower corner of your screen choose Mobile in the Device type field. Click Save

9. A special meta tag should be added to your website in order to demonstrate mobile templates on mobile devices properly. This tag is needed for mobile version of templates.

 

Now your campaign has a template for mobile devices, which can look like the example below. 

 

Was this information helpful?
Thankyou. Do you want to add anything else?
Thank you.How can we improve this document?
save

The page cannot be found

The page you are looking for might have been removed, had its name changed, or is temporarily unavailable. Please make sure you spelled the page name correctly or use the search box.