Step 1: Create your popup template
- Select the Popup template from the option list
- Name your template
- Click on Create Template
Step 2: Build a custom popup
You can use Gutenberg or Elementor to create and customize your popup.
Step 3: Customize your popup with Theme Builder
Look at the Settings Sidebar on the right and visit the Theme Builder tab.
Two tabs for Theme Builder settings include General and Design.
Visit the General tab to customize the elements below:
- Width, Height, Position
- Hide Overlay, Hide Close Button, Not show popup if click close icon
- Open Animation
- Close Animation
- Animation Duration
- Trigger Condition
Visit the Design tab to customize the elements below:
- Padding, Border Radius
- Scroll Lock
- Close Button
- Close Icon Color, Close Icon Background
- Popup background, Overlay Background
Other settings include Display and User Role Settings, Responsive Visibility, and Time Duration Settings.
- Display and User Role Settings: allow users to control where and for whom the popup appears on a website.
- Responsive Visibility: Use toggles to Hide on Desktop, Tablet, or Mobile.
- Time Duration Settings: set specific time-based display conditions for your popup.
Step 4: Check how the popup displays in the frontend