Why should you design mobile-only popups?

In short:

Here's how to take on the challenge!

Technique #1: Use one of our mobile-friendly templates

In the template gallery (the first screen that appears after you click "Create a New Campaign"), click on the mobile filter available in the upper-right corner of your screen.

Technique #2: Activate the TAB

The TAB provides an additional option to display non-invasive call to actions on mobile devices. You can read more about the TAB here.

Technique #3: Design your own mobile-friendly popup

Set your popup to display on phones

Duplicate your original popup.
Open it.

In the left menu, click "Display" and "Audience".
Next to Device, select "Display on mobiles"

Adjust the size of your popup

Back in the editor, we now have to adjust the size of the popup.
We recommend 320 (width) x 160 (height) to make sure it displays on most mobile phones.

To adjust the size, click "Popup" in the left menu, Style and in the right menu, select "Size"


Adjust the copy to fit the new popup size

We recommend removing images first. They often take a lot of space and can have a big impact on the loading time for your mobile users.

Then adapt the size of your texts and call to action and try to remove any mention which is not 100% necessary.

A quick example:

Adjust the position of the popupĀ 

While displaying a popup in the middle of the screen is OK on desktop, the standard on mobile is to display it at the bottom of the screen.
To do so, click "Position" and select the bottom position:

Last but not least, make sure your popup is easy to close on a mobile device. Don't hesitate to increase the size of the closing X to make it easier to tap.

You're done!

Did this answer your question?