The first popups were created from the scenario imagined by Ethan Zukerman for theaccommodation of his web page on Tripod in the early 90s. His users were complaining about the number of ads he placed on the website, so he decided to place the banners on a separate page that opened when a user accessed the page.

This little piece of code still wasn't a real popup like you see on every website right now, but that's where it all started. On modern web pages, pop-ups are used for different purposes, not just for advertisements. Contact forms, privacy policy warnings, and subscription suggestions are also often presented as pop-ups.

There are two things that annoy users when it comes to popups: when they jump on you when you do not want them; and when its appearance differs completely from the style of the website. These two problems appear when you use plugins that do not seem to be of the highest quality.

The biggest problem of most plugins that novice developers use for creating pop ups is the lack of control over the resulting message. However, you could avoid all these problems if you use Elementor to create a website.

Two awesome plugins, created especially for Elementor Page Builder, help you create popups of any type, shape and style you need – Elementor Popup Builder et JetPopup. Since they're both made out of the same flesh as Elementor was, the only question to ask is which of these plugins to choose. To help you make this decision, I'm going to do a thorough review of both and you can compare their pros and cons. So let's go !

Download and installation

This is not the most important criteria when choosing which plugin to use, but to try it out you need to get it first. That's why I'm going to start from the very beginning and outline the process to get it - the pricing, the effort involved, and the simplicity of the setup process.

Popup Builder

Elementor

This plugin was created by the Elementor team. We could therefore call him his real "child". This is the last update for Elementor, released in January 2019 to meet customer needs. However, it is not available for users of the free version of Elementor.

Popup Builder is included in the professional subscription plan. So, to have the ability to create popups, you must first have Elementor Pro. The simplest pricing plan that lets you use all of Elementor's variety of features for a single website costs $ 49 per year. Thus, from the first steps (purchase of Elementor Pro), here is the algorithm for obtaining Popup Builder:

  • Buy Pro Elementor Page Builder.
  • Go to your personal account and download the plugin.
  • Go to your website dashboard, Plugins> Add new, click on the “Upload plugin” button and choose the appropriate .zip file.
  • When the installation is complete, activate the plugin with your license key.
  • Here is the Popup Builder can be found in Templates> Popups tab.

It's a bit of a long road, but with Popup Builder you also get a huge collection of different elements from Elementor, such as widgets, templates, and other additional tools.

Popup Builder

JetPopup

The "family" of Jet plugins already has more than 10 articles and JetPopup is one of them. It has been carefully created specifically for Elementor and increases the number of its tools available. This plugin is tJetPopupsFully compatible with free and paid versions. So you don't need to make any additional purchases. JetPopup costs $ 15 and once you get it you can use it for just one website. If you need it for more than one project, you can purchase the plugin under the developer's license (it will cost you $ 45) and use it for five websites. The algorithm for getting the plugin is a bit simpler:

  • Buy the plugin on the TemplateMonster Marketplace. It will be downloaded to your computer.
  • Go to your website dashboard, Plugins> Add new, click on the “Upload plugin” button and choose the appropriate .zip file.
  • When the installation is complete, activate the plugin.
  • Here is! When you open the Elementor customization menu (by clicking the "Edit with Elementor" button), you will find the JetPopup section in the left menu of the widget.

JetPopup

Popup creation

Now, when the tools are there and ready, I can try to create a popup with both plugins and see how simple and understandable the feature is. Next, I'll create a basic pop-up and take a look at the customization options for Popup Builder and JetPopup.

Popup Builder

In Pro Elementor pop-ups are done separately from site pages. To change the look of the website, open the page you want to customize, click the “Edit with Elementor” button and make changes. But to create (and then edit) popups you have to go to Templates> Popups and hit the “Add new popup” button.

Popup Builder
Try Popup Builder Now

In the opened window, you need to choose the template you will create (yes, you can create templates not only for pop-ups, but also for pages and other items) and give it a name.

popup creation

After pressing the "Create template" button you will be redirected to the Elementor personalization menu. It is easier to customize an existing item by building it from scratch. You will therefore first be asked to choose an appropriate model.

popups library

I chose one of the models displayed at the top of the library list. Right after the choice, you land on the Elementor workspace that you're probably used to. Personalization options are placed in the sidebar on the left side of the screen. You have three tabs here.

The "Settings" tab allows you to change the layout of the popup, change the name of the model and preview. On the "Style" tab you can customize the design - change colors, fonts, images and borders. The "Advanced" tab also has a set of additional sliders; for example, they prevent the popup from closing with the ESC key.

popup settings

As you can see - nothing unexpected, if you have used Elementor before you will not encounter any issues with this plugin. Here is a detailed video that explains how to create a pop-up window using Popup Builder:

JetPopup

This plugin also adds a new tab to your dashboard of WordPress theme and with its help, popups are also created separately from pages. Out-of-the-box popups are also stored in a tab named “Popup library.” To create a new popup, you can either press the “Add” button on the predefined template or go to JetPopup > Add new popup, give the template a name and press “Edit with Elementor.”

add new popup

The field of work is slightly different from the norm because you are now creating a smaller window. In the left menu, you can add any type of item to your popup.

popup elements

The JetPopup plugin adds a single item to the widget menu - contextual action button. This allows you to define the type of action that will occur when the user presses the button.

popup action button

edit popup action button

It is not really obvious to open the settings from the pop-up window. You need to click on the maintenance button at the bottom of the menu. The settings menu is quite similar to that in Popup Builder, but there are only two customization tabs. “General Settings” allows you to define an animation effect, rename the model or define the conditions. On the “Style” tab you can change layouts, colors, images, fonts and borders.

popup general settings

JetPopup has a little less obvious functionality but compensates with detailed and useful video tutorials.

triggers

To be useful and not to annoy visitors, popups must appear at the right time. The conditions under which the popup is displayed are called "triggers". The more detailed the conditions available, the more flexible the popup plugin is. Precision is very important if you do not want your user to leave the site after the subscription form pop-up window appears.

Popup Builder

popup builder editing

publish popup

This plugin helps you define the necessary conditions just after customizing the pop-up window. When you press the "Publish" button you see the window in which you can define conditions (on which pages this popup will be displayed), triggers (when the pop-up window will be displayed) and advanced rules.

Popup Builder has six triggers, such as display on one scroll and click, and seven advanced rules, such as display after a set number of sessions or display on certain devices. Triggers and advanced rules have simple slider switches and it will be very quick to set all the parameters you want.

JetPopup

popup settings

front page of a popup

All the triggers, conditions and opening events are grouped together in the parameters. After clicking the maintenance button, you open the settings tabs and can set triggers immediately. You can set the percentage of the page after scrolling, the context menu to display, or the number of seconds after which the user will see the message.

The window can only be shown once or every time the user performs certain actions (I don't highly recommend it - it won't make users happy). You can also choose very precisely which posts or pages this concrete pop-up will be displayed. In general, this plugin is quite flexible and allows you to display popups with great precision.

Positioning

Users certainly won't be able to avoid windows that jump right out of the center of the screen, but they distract from website visitors and can be really annoying. Not all pop-ups should be placed in the center, a narrow ribbon at the top will be less noticeable, but can be much more effective. This means that you need to control the position of the window and be able to move around the screen.

Positioning

Popup Builder et JetPopup divide the screen into nine sectors and allow you to place your popup in any of them. Positioning is defined along the left-right and up-down scales. It's not very flexible, but it's enough for a popup.

Animation effects

The way the window slides (or rolls or jumps) on the page is very important. If the window is moving too fast or too slowly, it will not be effective. Bounces, tickles, and tremors should also be used with great precision. Animation effects make the site more dynamic, but they can also spoil the whole impression.

Animation effects

Popup Builder has 36 types of input animation, including different types of sliding, unfolding, zooming, bouncing and rotating in different directions. All of this, along with the duration of the animation, can be found in the "Layout" section of the Settings tab.

jet popup settings

There are 13 types of animation in the plugin JetPopup, including fades, vertical flipping, different slides, bouncing and zooming. You will find them in the "Settings" section of the Settings tab.

Models

In some cases, you want to create a popup with a specific structure and know exactly how it should look. But this is a rather rare occasion; much more often you have no idea what elements your popup should contain. This is where templates come in handy. Even if you don't use any of the pre-configured samples, processing them can give you a good overview. And, of course, customizing an out-of-the-box item is much faster and easier than building it from scratch.

Elementor model library

Popup Builder added a category to Elementor's template library. As I told you before, you can see this right at the start of the new process of creating a popup. The assortment of popup templates is large enough; there are more than 100 items. In the upper left corner, a sorting tool by drop-down category allows you to speed up your search. The categories are understandable, and it won't take a long time to find the popup you need.

jet popups presets library

JetPopup also has a huge library of templates. All of them are stored in the Contextual Library tab and have handy features like the preview button and usage counter. There are more sorting options, the list could be configured to display a specific type of models and then be placed in any order; for example, depending on the creation date. I can't tell you the exact number of models available, but there are definitely over 100.

Comparison chart

Elementor Popup Builder JetPopup
Price $ 45 $ 15
Models 100+ 100+
triggers 6 triggers, 7 advanced rules 5 open events with additional parameters
Animatio 36 kinds 13 kinds
Tutorials documentation documentation, 9 video tutorials

JetPopup vs Popup Builder

Conclusion

I can't say which of these two plugins is the better; it's too complicated to judge them. Each case and each person has their own requirements for the choice of plugins. I guess you should define it yourself - which of these two will be best for you? I wish you good luck in adding an awesome popup to your website!