Skip to main content

Pop Ups

Here are step-by-step instructions for creating and designing popups, including how to find and adjust their settings.

Jennifer Williams avatar
Written by Jennifer Williams
Updated over 7 months ago

How to create, design and build a Popup:

In this guide, you will learn:

How to create a new popup:

To create a new popup, navigate to Pages -> Add New -> Popup

You can either choose an editable pre-made popup or create one from scratch by selecting the Empty Popup Button.

Where to find your popups:

To find the popups you have created, navigate to Pages -> Popups

Popup Builder: How to design and edit a popup

The popup builder looks and works exactly like the normal page builder.

Any widget, regardless of its type, is fully draggable into a popup interface. Once moved into the popup, the widget retains all its functionalities, ensuring that it can be modified, rearranged, and customized just as it would be within the standard page builder environment.

This allows for a seamless and versatile editing experience, giving users the flexibility to optimize and personalize their content without any functional limitations or compromises.

Popup Settings: How to change/adjust a popup position, name and other display options

To access the general settings for the popup, either click the "Gear Icon" next to the popup name and select "Show Settings" or open the popup by clicking on the name and select "Popup Settings".

In the Popup Settings, you will find the 6 layouts available for the popup. You can play around to select the one you like.

You can also edit:

  • Popup name (Easier to find the popup if you link to it)

  • Options for when to trigger the popup (if a button/link click does not trigger it)

  • How often to show the popup

  • Lastly, what animation to have on display

How to select on what pages a popup should show or be visible:

If the popup is being triggered automatically you can select on what pages it should be displayed.

To select on what page of your website a popup should show, open the popup and select the "Show On" option. Here you can select on what page your popup will display.

To style your popup content and layout, click on the popup name to open it.

Then click on the brush "Style" icon.

This will open the Popup content layout settings box.

In the popup content layout, you will see the option to where the image should display. If you select the middle option, no image will appear.

You can also adjust:

  • Background colour for the whole popup

  • Colour of the background overlay under the whole popup

  • Close button colour

  • Lastly, padding of the popup window

Did this answer your question?