Introducing Popup Builder

Today, we are releasing what we consider one of our most substantial features to date - The Elementor Popup Builder.

Play Video

The First Design-Oriented Popup Builder for WordPress, Built into Elementor

Popups – users hate them, marketers love them. If only we could change this love-hate relationship! 🤔

It’s pretty well known that popups are extremely effective for increasing sales, leads, and conversions for pretty much any business. But until now, popups presented a huge challenge in 4 key aspects:

  • Limited (if any) design customization for popups.
  • No way to include website content inside popups.
  • A different interface for your site and for your popups.
  • Setting up advanced targeting is a complicated task.

A popup feature was consistently ranked among our top feature requests since pretty much day one, but we wanted to do it right. So we spent months figuring out an entirely new process that faced each of these challenges.

One Interface, one workflow

The Ultimate Editor for Building Popups

Just like the Theme Builder, Popup Builder offers a new and better way to build and manage popups.   We tried to create an intuitive process that would be entirely handled in one single and familiar editor – Elementor.

One of our main achievements here is creating a single workflow that will allow you to build popups as part of one web building process.

All 4 stages of building your popups will now be handled inside one streamlined Elementor editor:

  1. Customize the popup window
  2. Build the inside of the popup
  3. Set your targeting rules
  4. Connect it to your site links and contact forms

And that’s it!

Every step of your web creation process – from building a landing page, creating the popup and hooking it up to the page is made in one place. Building highly-converting marketing funnels has never been easier.

Achieving the highest level of design and maintaining proper design consistency are two fundamental values for any web designer. Having one design interface that manages your website design as well as your popup design is the only way to properly achieve this.

When I think back of all the switching back and forth between screens that popups involved, I feel sorry for all the hours we lost. No more wasting time!

Your Content, Your WordPress, Your Elementor.

Dynamic Content Will Boost Your Popups

Popup Builder

With Popup Builder, you can finally use the same Elementor editor you know and love. Add any widget and create any layout you like. With the power of Elementor, you can build advanced popups that take advantage of all your site content.

Designers create amazing Elementor templates and global widgets that are used all over their site. It makes sense to use the same assets in popups.

The same goes for WordPress texts, images and media. Adding them to popups should be as easy as building a landing page in Elementor. But that’s not all. How about adding WooCommerce products, ACF custom fields, dynamic content and request parameters, related posts lists, Elementor forms…

You see where I’m going. Everything you’ve built for your site, should be easily accessible and added with a simple click to your popups.

Adding your assets is especially crucial when it comes to forms. By incorporating Elementor forms, you are able to integrate popups into your favorite email marketing tools by simply adding your current forms. No extra steps needed!

Superior Popup Design

The Power of Elementor

As we already mentioned, Popup Builder lets you take advantage of Elementor’s various design, layout and styling capabilities to create fine-tuned and out of the ordinary popups. Use its various widgets, mobile editing tools and advanced customization to really have your popups stand out.

Get inspired by our templates, and notice how we created popups that don’t really look like popups. An example of this is the popup that uses transparent backgrounds to ‘step out of the box’.

Elementor Popup Builder lets you customize not only the content of the popup, but the popup window and surrounding design as well.

For the popup window, you have full control over the layout, including height, width, horizontal and vertical alignment. You also have full styling options for the close button and the overlay.

There are also several advanced settings that include:

  • Show close button after a set time
  • Automatically close after a set time
  • Prevent closing on overlay and on ESC key
  • Disable page scrolling
  • Avoid multiple popups

Forget about the boring popups you used to know. Start experimenting and creating imaginative popups that communicate more closely with the design language of your site and brand.

Conditions, Triggers and Advanced Rules

Advanced Yet Intuitive Targeting

Elementor WordPress Popup Plugin

Once you are satisfied with the popup you created, we can hit publish and set the conditions, triggers and advanced rules for your popup. These settings help determine when and how the popup appears.

Conditions

Conditions are pretty straightforward and work for popups in the same way they do for all other templates in Elementor. Choose which pages, posts, and areas where your popups will be displayed.

Triggers

Triggers help set off popups based on user actions (i.e. click to open popup).

Browse the different triggers: On page load, on scroll, on scroll to element, on click, after inactivity and on page exit intent.

Advanced Rules

Advanced Rules determine the requirement that must be met for the popup to appear (i.e. user visited the website at least two times).

If the user visited a certain number of pages, visited a certain number of sessions, arrived from a specific URL, arrived from a certain source, has a certain user-role or is using a certain device (mobile, tablet or desktop). By combining different rules, you can set popups for a specific audience, such as users who still haven’t converted to clients but who have already visited your site before.

Popups on demand

Open Popups With Any Link

You can set off popups either by customizing triggers (as described in the previous section) or by setting a manual trigger via a link or form.

Dynamic Links

To get a link to open a popup, go to the link, click the dynamic icon, then Actions > Popup.   

Click Popup > Open Popup > and select the popup you created.   You can have the popup either open, close or toggle between these options in a single button. The toggle option is useful for popup menus.

Actions After Submit

Elementor forms can be used to open or close popups.   

If you’ve included a form in the popup, go to Forms > Actions After Submit, and choose Popup > Close Popup.   Similarly, if you want an external form to open a popup, go to Forms > Actions After Submit, and choose Popup > Open Popup, and set the requested popup you want.

A Template For Every Popup

100+ Smashing Popup Templates

Elementor Popups

To start you off on the right foot, we created over 100 designer-made popup templates. Choose between the different types of popups:

  • Bottom bar
  • Classic
  • Fly in
  • Full screen
  • Hello bar
  • Slide in

Keep in mind that these popup templates are not the only templates you can use. Incorporate any Elementor template or block inside popups, whether it’s your own custom template or Elementor’s pre-made ones.

Combine different widgets, templates and targeting settings to create any type of popup you can imagine, including: email subscriber popup, login form, content lock & upgrade, welcome mat, promotion popups, exit intent popups and more!

For this popup release, the amazing team behind the Envato Elements plugin joined forces with us and created over 100 additional popup templates of their own. (Thanks, guys! 👌)

Now You Can Build Much More Effective Popups With Elementor's Popup Builder

The Popup Tool that Does It All

With Popup Builder, we managed to create the ultimate tool that offers superior design as well as marketing advantages. You get an unparalleled level of design customization, made possible with all the power of Elementor, with its various features and widgets. 

Take advantage of the targeting engine we built, and segment popups according to page-based, time-based, device-based & visitor-based targeting options. 

Finally, in case you missed it, crank up your speakers, and watch the video clip (with original music!) we prepared in order to celebrate the release of popups:

Get Elementor Pro today and start making popups that your visitors will love.

About the Author

Ben Pines
Ben Pines
Elementor evangelist & head of content. Ben has been in the online marketing industry for over 10 years, specializing in content marketing. WordPress has been Ben's platform of choice since the time it was used solely for blogging.

Share on

Share on facebook
Share on twitter
Share on linkedin
Share on whatsapp

you might also like

Liked This Article?

We have a lot more where that came from! Join 842,215 subscribers who stay ahead of the pack.
By entering your email, you agree to our Terms of Service and Privacy Policy.

Comments

215 Responses

      1. I think what wayne is referring to is triggering a popup by adding a class to an html element. The current popup URL generated using the Direct Link method specified above is a bit of a garbled mess from an SEO standpoint. I’m still very excited for this feature.

  1. And I thought it’s gonna be just a simple popup widget…
    Amazing system, looks like it has everything popups needs.
    Great job! Please give us some animations / 3D effects and widgets to make our sites even more exciting.

  2. Really interesting options.
    Thank you.

    I think more important think is to deliver options to configure:
    – cart page
    – checkout page
    – thank you page
    – account page

    You created WooCommerce Product Builder…but it’s high time to provide options to configure the rest WooCommerce pages by Elementor.

  3. Next on the list “maybe” a more robust Forms Maker with Conditional Logic and more to compliment this amazing Popup builder 🙂

    1. You can trigger by using ‘Scroll to ID’, or trigger manually to a link by clicking on the dynamic icon next to the link field, Actions > Popups, choosing the popup and that’s it!

  4. Can you set the popup to change state after submit? So, just load a different popup design inside the current popup? Use case: visitor clicks a popup link, subscribes to our list to get a download and the popup changes to a success state that offers a tripwire product.

  5. how can I change trigger conditions after I have published a Popup? How can it be avoided to open a Popup again, when it has been closed by the user?

    1. There is an arrow next to the Publish button that opens the Publish settings with triggers.

      When you set a link to close a popup, and choose the popup, you can also switch on ‘Don’t Show Again’

  6. I’ ve been expecting this feature integrated in Elementor for a long time and voila is finally here. Ok there was a plugin developed by someone as a solution until now but seeing that now you can use it on page scroll, on page load or on exit intent, it opens a new era for using Elementor, especially for affiliate marketing. It is a big step forward to replace many paid services. Thanks !

  7. Love it! Please can the posts widget be overhauled next? It would be really awesome if it had more options. It’s so bare bones compared to what you can actually do with a single post pages. Plus, single post pages can have custom content and meta data, and the posts widget can not.

      1. +1 I keep running into the need to extend the functionality of the posts widget as well. Specifically, needing the ability to pull custom fields in, and more styling control (ie: placement of categories/tags/custom fields).

        It would also be exceptional if the posts lists could pull up single views in a pop-up. Example use case: a college website with a big list of courses. Instead of clicking to see the single view for each course and then clicking back to the course list page, it would be nice to pull up the single views in a lightbox but remain on the list page. I could see this being true for many use cases where the single view doesn’t have a lot of information.

        Keep it up! I’d happily page even more for your builder. The value is exceptional.

  8. Is this Thrive Leads just set within Elementor? Can you explain any differentiation? Looks great btw, just curious if it’s indeed a viable/better alternative. Thanks!

    1. There are many popup plugins. None offer the same design level, the same UI, speed, interface, targeting, ease of use… The list goes on.

      It really is a great feature. Try it and you won’t look back. Plus, don’t take my word. We have 30 days money back guarantee. Be sure to come back and tell me if I was right with my recommendation

  9. Great new feature! Unexpected, actually, but great further development after the background-image features for mobil! Every website needs conversion and call to action tools.

  10. Hi! Popup feature is just GREAT!
    Is it possible to connect a popup with specific button click in our website ?
    For example I want to enable the popup when the users click on call to action button.
    Can I do that ?

  11. This is now really amazing addition. I hope you guys focus more on such templates for website parts rather than on web application development with Elementor. I have seen your efforts in that department and honestly even the simplest website applications like real estate portal is not possible with all those recommended plugins. So let’s focus on design and productive elements for Elementor

      1. Indeed – this works not too bad and I hope it will get even better 🙂

        What will be really great if the content templates for Toolset and the Toolset filter block could be styled in Elementor. This would allow me to easy build search and filterable archives with Toolset and Elementor

        Also it would be great if this could be done with Pods

        BTW – the Popups are awesome!

  12. Amazing!

    But it needs an option “open with css class” if I for example wants to open a login popup from a menu not created in Elementor.

  13. Amazing stuff! I know it’s probably hard to implement, but here’s a suggestion for something I would love to see in this new feature: Including a Geo rule in your “advanced rules”. That way, the popup would be shown only to users from selected countries. And the other way around as well, excluding some countries. That would be extremely useful for affiliate bloggers like me, who have different affiliate links for different countries. It would also be great for a GDPR slide in, to be shown to European countries only. But still, great addition guys! Cheers!

      1. After have upgraded to 2.4 Pro, I can´t edit any page anymore! A button appears instructing me to switch to Save Mode, I do it but does not work !

  14. OK fantastic. I’ve been playing with it and answered my own question, then found a bug (maybe).

    – VIDEO? Yes. You can put any Elementor content in the popup. It’s a modal and works great.

    The bug is with the close button “X”. Although I put is as “outside” and changed the position in responsive mode, the “X” still is all over the place for both mobile and desktop. Check that out. It looks fine in responsive mode, but looking at the live page with no cache, the “X” floats on top of the video and is not positioned correctly.

      1. I think another way to explain it would be to suggest using an icon, use the “menu” icon if you prefer, or any other and use the pop-up as a way to present a totally unique site menu!

  15. Simply amazing! It’s like you guys read my mind because this looks like exactly what I was looking for on the site I am currently developing with Elementor.

    Are there plans to be able to integrate the popups with other popular wordpress contact plugins (or is that already possible)?

    Massive hats off to Ben and the rest of the amazing Elementor team, you guys are phenomenal!

    1. Hey Puvan, you just embed other forms. That’s part of what’s great here. You can include any WordPress content / plugins etc inside popups. It’s just like any other Elementor page or theme part you are editing

  16. Hey Ben. What a breakthrough. I was initially using a plugin for popups that worked really well and concentrates on conversion. Without mentioning the name, you probably know what product that is. Problem is, it’s quite resource intensive. Since then I had used 2 different plugins (that work with Elementor) and found problems with both of them – names withheld. So, with reluctance (because I love website speed), I reverted back to the original product. Thank heavens my Elementor templates are saved. Now I achieve everything I need without any (other) external plugins. Whoo hoo! Now all you guys need to do is include tables!

  17. OHHHHH MY GOOOOOOOOOD

    Seeing alread the future…. when millions of websites having tons of useless, boring, annoing, etc… POPUPS ….. every click another adventure item…. and they might call this then
    “interactive comercial entertainment experience” !?
    Thats so sick…..
    BTW:
    POPUP missclickers are not really a base for a happy customer. And only happy customers come again.
    Might bring a bit mor sale rate on the first sight, but lots of more countermands then…..An outlook to the future might appear as a nightmare….
    The problem with these kind of webtools is, that they are mostly used for tricking and missleading visitors – doing things they dont want to do….
    DO YOU WANT OT BE TREATED LIKE THAT – THAN GO FOR POPUPS

  18. How do I access this popup builder? I’m new to Elementor(and new to building a website) and still getting used to using it, so I’m probably missing something, but I don’t see it? I’m using the current version of Pro.

  19. this is great. but it needs other close triggers too. for example on scroll, after clicking a button. i want it to go both to an anchor and close the popup. this is not possible right now :C

  20. The best thing I’ve seen in this year 😀 LOVING it! Thanks guys for your hard work! You’re the best, you’re rock on the market!

  21. trying one more time to let you all know drop down menus don’t work when a user has cookies blocked. This is new with 2.4. Reverting back to 2.3 fixes it. But no Popups…

    1. The same with me. There is something strange with layers. Images are at the front layer covering the text when should be at the back. Contacted the Support.

    1. You will need the latest versions of Elementor & Elementor Pro (2.4.3 & 2.4.0) in order to be able to use Elementor’s Popups.

      Please go to Dashboard -> Updates (in the upper side) and see if Elementor Pro shows up there.
      You can check it and press the “Updates plugins” section. If you don’t see any Elementor Update available, please try deactivating & reactivating it.

  22. ? Most awaited cool feature now available! ?
    ? Great job! ?

    ? Popup Builder Template Request:
    Although we can create from scratch as of now but it would be great if there are Scroll to top button templates within Popup Builder. Hope to see that very soon.

  23. I have the PRO version and I would like to use the Hello Bar but I have seen that there isn’t Aweber. Could you add it, please?

  24. I think it’s a really interesting tool. However I found some drawbacks when using it:
    1.- When creating the popup, a WordPress page template is assigned by default, which does not allow modification to assign a different one.
    2.- Once finished creating the popup, there is no way (at least easy to find) to re-edit the display options (conditions, triggers, etc).

    I think this option needs a revision yet … I hope it comes soon.
    Thank you!

  25. Great work!

    However, small issue with launching a pop-up from a button click (dynamic content); When the pop-up is closed, it can’t be re-opened (unless the page is re-loaded, obvs)…?

  26. great work , however ,i tried to build my first popup but it show up in the footer of the page as it’s content in the page ,it doesn’t show up as popup ,
    by the way i am using (ONLINE SHOP) theme. what do you think should i do ?
    thanks

    1. Yes. You will need the latest versions of Elementor & Elementor Pro (2.4.3 & 2.4.0) in order to be able to use Elementor’s Popups.

      Please go to Dashboard -> Updates (in the upper side) and see if Elementor Pro shows up there.
      You can check it and press the “Updates plugins” section. If you don’t see any Elementor Update available, please try deactivating & reactivating it.

  27. Hey Ben, is there a function to not show the popup if they have already submitted the form within the popup.

    Otherwise, how do you suggest I exclude a single page (i.e. my thank you page)? Really awesome work guys, I just LOVE it!

  28. Elementor pro becomes more than just a page builder. It’s a plugin more and more complete. With the possibility of setting up popups, it suggests that it will become a Super Plugin … Great job Thank You

  29. You guys are really great. I have an issue though. My popup works correctly with the button click. However it is ALSO coming up on page load. No conditions or triggers were set. I just want it to appear when someone clicks a button. How do I resolve this?

  30. Guys, I created a cookie bar and found that you can simply reload the page to remove the message rather than clicking on the close button, Is there a way to resolve this? Also found the popup didn’t work at all on IE 11.

  31. The Popup Toggle does not work as said.

    I created a hamburger icon and a popup menu.

    I set the burger icon to toggle the popup.

    When i close the popup menu and again click the burger icon it does nothing.

    1. I contacted support and they told me to put it up on elementors GitHub. Think that if the toggle feature does not work then it should get taken out or give us an easy work around.

      Love the product dont always feel like a get a personal response for support and feel its more cut and paste with out taking my question with care.

  32. Hello, I just create a POP-UP but something is missing, the only condition is to open in one page “HOME”, after published, I can not see the POP in the “HOME” page, can you tell me why?, thank you

  33. Thank you ELEMENTOR I just saw the seminar in YouTube about the POPUP and all was clear, congratulations it is a great help for all my web pages. Awesome.

  34. How can you have a pop button placed over an image? Every time I try to move my absolute positioning button over an image ii disappears. Is there a way to bring it to the front so it always appears?

  35. WOW. That’s amazing. I’m glad that you people introduced this, I feel like this is going help me a lot. Thanks for everything! Elementor is LOVE!

  36. Is there a way to set a timer for the exit intent, so that it wouldn’t show up until someone is on the site for at least a minute? Thanks!

  37. Help. How to trigger a VIDEO popup with a button that is not made with Elementor? I can’t find the “Open By Selector” option

  38. Thanks for elementor you saved my life! I do have a question, is it possible to use a pop over in a pop over just like asos.com mobile navigation menu

  39. Hi Elementor team,

    how does it look from SEO point of view using these popups? Are search engines like Google able to crawl the content of these popups?

    Best regards

  40. Sorry Guys, but where are your videos about making good Contact Forms with elementor Popup? You have a few templates, yes. but they are not really contact forms.

    How can i add a second grid for the contact form fields?

    There is nothing explained.

  41. If someone clicks the close button, the popup should be shown small on the bottom of the page. Is that feature available? I can’t find it.

  42. Is it possible to programmatically trigger a pop up in a php file?? I have a loop in my functions file which checks a WooCommerce cart to see if it contains a product with a certain category in, if this evaluates to true I want to load a pop up.

    Or are there any other ways of loading a pop up if a certain product is in a woocommerce cart?

    Any support from anyone would be greatly appreciated as this would be such a good feature 🙂 thanks!

  43. Will popup blockers block these popups? Want to use them for lightbox contact forms, but want to make sure ad blockers don’t prevent users from opening the forms.

Leave a Reply

Your email address will not be published. Required fields are marked *

Want to learn how to build better websites?

Join 842,215 Elementors, and get a weekly roundup of our best skill-enhancing content.

By entering your email, you agree to our Terms of Service and Privacy Policy.