Articles in this category

Pop-Ups App

Create a unique, interactive experience for your users by adding pop up boxes that work!

Video tutorial

For your convenience, we've recorded a video tutorial showing how to easily create popups and we also explained some of the most common use cases of the popups in the video. Make sure to check it out!


Creating a popup

Head over to your Dashboard and click on the Popups App. You can create an unlimited number of popups by clicking the Create Popups button and fill in the given Title and Alias fields. 

Click the Create Pop-Up button to get started with creating one. 

The blank popup will appear on a new window. You can customize your popup by dragging and dropping elements. Use the black circles located on the four sides of the popup to adjust its sizing. To change the Popup Settings, simply click on the gear icon on the top left corner of the screen. From there, you can adjust Popup Styles, Layer Styles, and Popup Shadows. 

  • Popup Style: Adjust the popup's position, and animation styles, add a background image, and change the popup colors. 
  • Layer Style: Add a backdrop to your popup and change its image, color, and blur level.
  • Popup Shadow: Create a shadow for your popup using the Enable Shadow option. Change the color and adjust the position, spread, and blurring accordingly.

Assign a popup to an element

Assign a popup to these specific elements:

  • Button Element,
  • Title and Paragraph Elements,
  • Image Elements (including Gallery and Slider),
  • Icon.

Once you add these elements to your crafting area, click on the element → edit link → popup. You can then choose which popup you want to assign to your element.

You can also edit your chosen popup by clicking the Open Popup option. 

And, that's a wrap! After saving your popup, click on Preview, located in the Left Panel, and then select the element you assigned your pop-up to!


Triggering rules

With the Triggering Rules, you can display your popups right on your website and on what page you want them!

Start a lead generation campaign by adding a form or subscription element on your pop-up, announcing updates, or simply adding a nice greeting message for your visitors. It all depends on your creativity.

To make your popup visible on your pages you should:

  1. Select Page Rules, 
  2. Enter the triggered URL,
  3. Establish the max number of impressions,
  4. Set the appearance time in seconds.
The max no. of impressions is the number of times the website visitors will see the pop-up while opening this page on the same browser. If you set it to 0, the pop-up will appear every time you refresh the page.

Page Rules

Let's consider the rules you can set for your pages one by one:

  • Is: Your Pop-Up will be displayed only on the page you selected.
  • Is not: The Pup-Up will be displayed on all the pages but the selected one.
  • Starts with: The window will pop up only on the pages whose URL starts with the selected alias,

e.g. mysite.com/store/products/sale

  • Ends with: The window will pop up only on the pages end with the alias you added,

e.g. mysite.com/store/products/sale

  • Contains: The message will be visible on all the pages containing the alias you added.

e.g. mysite.com/store/products/sale

  • Does not contain: It will be hidden from the pages containing the alias.

Once the rule is set you need to enter the Alias of the page. Open the Pages App on Dashboard > Navigate to the needed page and click edit to see the alias.

The alias can contain only lowercase letters, numbers, and dashes.

We’re almost done. All you have left is to set the time when your PopUp will appear on your page once you've opened it.

Please note, that you can use natural numbers only, {1, 2, 3...}․

Did you find this resource helpful?
Return to top
Ready to get started
with Subbly?
Try for free