How to Create a Pop Up in Elementor

Creating a popup in Elementor allows you to display content in a modal window that appears when triggered by user interaction. Here’s a step-by-step guide to creating a popup in Elementor:

  1. Install and Activate Elementor Pro:
    • Ensure you have Elementor Pro installed and activated on your WordPress website. Popup functionality is only available in Elementor Pro.
  2. Access the Popups Area:
    • In your WordPress dashboard, navigate to “Templates” > “Popups” in the Elementor menu.
  3. Create a New Popup:
    • Click on the “Add New” button to create a new popup.
  4. Design Your Popup:
    • You’ll be taken to the Elementor editor interface to design your popup.
    • Drag and drop elements from the panel on the left to add content to your popup. You can add text, images, buttons, forms, etc.
    • Customize the appearance and settings of each element using the options in the left panel.
  5. Configure Popup Settings:
    • Click on the gear icon at the bottom left corner of the Elementor editor to access the popup settings.
    • Configure settings such as popup size, animation, close button, overlay, and trigger.
  6. Set Popup Conditions:
    • Under the “Conditions” tab in the popup settings, specify when and where the popup should appear.
    • You can set conditions based on triggers such as time delay, scroll depth, click, exit intent, etc.
    • You can also set display rules based on specific pages, posts, categories, tags, user roles, etc.
  7. Preview Your Popup:
    • Click on the eye icon in the bottom bar of the Elementor editor to preview your popup.
    • This allows you to see how your popup will appear on your website.
  8. Save Your Popup:
    • Once you’re satisfied with the design and settings of your popup, click on the “Save” button to save your changes.
  9. Publish Your Popup:
    • After saving your popup, you can either publish it immediately or schedule it to be published at a later time.
    • Click the “Publish” button to make your popup live on your website.
  10. Test Your Popup:
    • Visit your website to test your popup and ensure it appears correctly based on the configured conditions.

That’s it! You’ve successfully created a popup in Elementor. Visitors to your website will now see the popup according to the trigger conditions you’ve set.

Related posts

Bricks Builder Animation Enhanced With Softlite Litemove

Built-in Bricks Animations vs Softlite Litemove Enhancements Bricks Builder includes a variety of pre-built animations that can be applied to elements on your page. These animations are designed to be…

View post

ClonewebX Converts Any Website To Bricks Builder or Elementor

What is ClonewebX? ClonewebX is a tool designed to simplify the process of cloning websites and converting them into various popular page builders like Elementor and Bricks Builder. ClonewebX enables…

View post

How to Setup Automatic CSS With Bricks Builder

This video guide outlines the setup process for using Bricks Builder in conjunction with the Automatic CSS (ACSS) framework to ensure seamless integration. Starting from a fresh WordPress install, the…

View post
Dismiss PopupGet The Free Bricks Playground