Connect with us


Marketing tips: How to create popup?



Marketing tips: How to create popup?

Needless to say, in 2019, running a worthy site is even more than just a must-have. It’s an actual #1 goal for anyone who wants to develop their startup of a business. There’s no secret, a modern market is a busy place. You can enter it easily. Alas, it doesn’t mean that you will get the first customers in seconds. Sometimes this process requires weeks or even months, so how to further it?

There are many ways to stand out from the crowd. Obviously, you can search for the incredible web design trends that are popular this year. Still, such things as comfort and quality should go before all else. For these simple reasons, in this post, we will start from the very beginning. As the name of the article promises, we are about to teach you how to create a professional popup. And do it without touching a single line of code.

Would you like to design your classy popup effortlessly?

In this case, don’t stop reading, as I have so many tips for you!

What Is Popup?

Alright, this point was made for the beginners. So, if you already have any website building experience, just move to the next paragraph. Here I’m going to tell you what popup is and explain why you actually need it.

For starters, a popup is a graphical user interface display area which automatically appears in the foreground of the visual interface. To put it briefly, this is a small window that you frequently see when visiting a website for the first time. Usually, the window offers a visitor to subscribe to the daily newsletter. On the other hand, popups are commonly used to showcase some news like sales info, discounts details, or just new arrivals. Without a doubt, you can also see popups with an advertisement. They are also very popular.

What Are The Main Features Of A Popup?

Here are the main features of a regular popup.

  1. Pop-up can be initiated by a single or double mouse click. So, it appears automatically as soon as a visitor performs this action(s).
  2. It can also be initiated by a rollover.
  3. Sometimes popups are initiated by voice command.
  4. Besides, they can be timed to occur.
  5. Popup window will always be smaller than the background window or interface.
  6. It always has some call-to-action (CTA) texts.
  7. JavaScript is a popular thing to be used to create a popup. Java applets are used less commonly.
  8. Also, sometimes developers use Adobe Flash to create a popup.
  9. Popups can be generated by the security holes in browser security.

In 2019, people mostly treat popup as the window that offers you newsletter subscription of discount details. However, these are only a couple of functions popups do. Keep in mind that such features as taskbar and menu pulldown should also be considered as a form of popup.

What Is Popunder?

Same to all the other popular ways to communicate with the web audience, popups have another variation. I’m talking about popunders. Popunder is a popup window with an advertisement. It always opens a new browser window under the active window. I’m sure you already faced popunders multiple times. And, although the popunders don’t interrupt the visitors immediately, they can be extra irritating. I would not recommend you to use this form of popup in case you want your website to be professional and trustworthy.

Why Do You Need Popups?

Now you know a lot about popups and can definitely identify them among the rest of web design elements. Thus, let’s clarify why you may need popups. To begin with, let’s take a quick look at the recent statistics.

  1. Firstly, in 2018-2019 years, only 0.25% of new shoppers say they are about to make a purchase at all. What is more, when these people are visiting the online shop again, the chances of making a sale increase by 9 times.
  2. Secondly, of the shoppers who initially leave the site without engaging, over 75% claim they will return later to make a purchase or even to become a regular client.
  3. Thirdly, companies that use exit-intent popups (the ones that appear when a visitor attempts to leave the site) experience an increase of sign-ups by 600%!

There are actually no comments needed, these numerals are fantastic. And these are not just mere words. When used properly, popups do increase your sales and customer engagement at all.

To make a long story short, using popups you talk to your audience. Thanks to the feature, you can:

  • notify your regular clients about the huge sales and share different discounts info with them,
  • tell shoppers that you are waiting for new arrivals, so there will be some fresh items available soon,
  • introduce your new projects to the audience,
  • introduce such things as giveaways,
  • the showcase which posts from your blog appeared to be most popular this week or month, and so much more!

How To Create Popups?

As it was promised, in this post, I’m not going to overload you with different technical terms. Would you like to create a professional popup to make your business website or an online shop even more visitor-friendly? In this case, let’s see how you can do it without coding.

Logically, to have your popup created, you will need to find a code-free plugin. Fortunately, in 2019, all the worthy plugins do not require you to have any extra skills. Here are 2 top-rated popup addons you can use for your website!

JetPopup Plugin For WordPress Websites

JetPopup is a trendy addon which was created, designed and featured for WordPress websites. Thanks to the creator-friendly and intuitive interface, working with the plugin is as easy as ABC. Like all the modern WP plugins, JetPopup is an Elementor-based item. It means that you can create and edit your popups designs right in this WYSIWYG page builder. Elementor works on a well-known drag & drop technology. With it, the only thing you should do in order to style your popup is to:

  • decide which feature you want to use, (they will be pre-built in the library);
  • then drag it,
  • and simply drop to the editor window.

By the way, Elementor comes with a cool live preview. It will show all the actions you perform in a live mode. So, here is how you can avoid the most common mistakes while designing your popups.

When working with JetPopup, you can place the popups literally anywhere.

Here are the ready-made positions the plugin provides you with:

  • A classic position that shows the popup in the center of the screen on the top of the page content;
  • A side-in position that makes popup window slide from one side moving the content to accommodate it;
  • Bar position that shows popups at the top or bottom of the page in the form of thin bar delivering information;
  • Bordering position that displays popup in one of the screen’s corners in the form of subtle notice;
  • Full View position that makes a popup to take the whole screen for your info to be 100% noticed;
  • A custom position that allows you to change the appearance and the position of the popup according to your vision.

Obviously, the add-on has a lot of ready-to-use functions. Another one is animations and other visual effects to be used with popups. Choosing one of these visuals, you increase the chances that the popup will be noticed by your prospects. Here are the visual elements JetPopup plugin contains:

  • Fade,
  • Zoom In,
  • Zoom Out,
  • Move Up,
  • Bounce In,
  • Bounce Out,
  • Slide Up,
  • Slide Down,
  • Slide Left,
  • Slide Right,
  • Horizontal Flip,
  • Vertical Flip,
  • and Rotate.

The plugin is very easy in customization. It allows a user to set up any popup they need within minutes or even seconds. When used with other JetFamily plugins, this addon allows you to enrich the website with:

  • Subscribe Newsletter popup,
  • Countdown popup,
  • Contact Up popup,
  • Discount popup,
  • Yes/ No popup,
  • Info Card popup,
  • GDRP popup,
  • Cookie Policy popup, etc.

To finish with, let’s see how using JetPopup will influence your visitor engagement.

Working with this WordPress addon you can:

  • On Opening: make the popup window show up when the page opens to deliver information;
  • User Try Exit: allow the popup to appear when the visitor wants to close the page to display;
  • Page Progress Scrolling: add a popup window to the page to be shown when a person scrolls the page to add;
  • Attached to Widget: set a popup to the specific Elementor widget to appear on click, hover, or scroll to display;
  • On Set Date: set the specific date when the popup will start appearing on the site;
  • User Inactive Time: make the popup window appear when the visitor has already spent some time on the page to add.

And now let’s move to the next tool with is also popular among modern web users.

Elementor Popup Builder

To make a long story short, Elementor Popup Builder is the first design-oriented builder made for WordPress users. Since the popup feature was consistently ranked among the top feature requests, the WP team worked hard in order to present this code-free item. According to the creators of Elementor Popup Builder, modern popups presented a huge challenge in 4 key aspects. They are:

  • 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.

For these simple reasons, Elementor Popup Builder was designed to fix all the named issues. How to work with the tool? Popup Builder allows its owner to build and manage popups in a new and better way. Like the previous tool, this one also works with the help of Elementor, which comes with every WP theme for free.

Among the main advantages of working with Elementor Popup Builder, I want to highlight single workflow creating. In a word, you can easily set up a single workflow which lets you building popups as part of one web building process.

On average, there are 4 stages of building your popups:

  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.

As expected, Elementor Popup Builder makes it easy to create different designs. You can do it without coding via Elementor panel. Actually, you can do everything and anything with your popups including adding various widgets, mobile editing tools, and advanced customization. Working with Elementor Popup Builder, you will style not only the content of the popup. With it, you can also customize the popup window and surrounding design as well.

Talking about the popup window, Elementor Popup Builder provides its user with full control over the layouts. You can edit such options as height, width, horizontal and vertical alignment. To say more there are multiple styling options for the close button and the overlay. Needless to say, Elementor Popup Builder comes with some advanced settings as well. Opening them, you will can:

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

In addition, inside the pack of Elementor Popup Builder contains more than 100 designer-made popup templates. For these simple reasons, the site owner will be able to choose between the different types of popups.

For example, you’ll have:

  • Bottom bar
  • Classic
  • Fly in
  • Fullscreen
  • Hello bar
  • Slide-in

To sum everything up, Elementor Popup Builder brings you all the opportunities for creative experiments. All in all, any element of your web design matter and popups do not make an exception.

Other Popular Popup Plugins

Here is the list of other popular popup plugins that website users also use all over the globe. Please notice that these addons are not as feature-rich as the ones named above. In my hasty opinion, the design of your popup matters. And matters a lot! However, in case you are looking for something simple, here are the popup plugins that provide only the basic options.


– is a simple plugin which helps you create popups. They can be made for such uses as:

  • Email opt-ins
  • Promotions
  • Social integrations
  • Etc.

In addition to the standard pack, you also get a lot of other position options. The list includes notification bars, and sidebar widgets. In the pack, you will see over 100 ready-made popup templates. Needless to say, all of them are fully customizable. You can edit these elements up to your taste with the help of a real-time WordPress Customizer. To finish with, ConvertPlus comes with detailed targeting and trigger options. Plus, there is a built-in A/ B testing and analytics. They should help you optimize the popups.

Ninja Popups

– helps you to create the popups with the use of a drag & drop page builder. Using the plugin, you can:

  • build popups from scratch
  • or choose one of the 73+ pre-made popup themes.

Among the advantages of this plugin, I want to highlight its animation options. Working with Ninja Popups, a user can apply 74+ different animation effects to their popups. Talking about popups optimization, you can do it thanks to pre-packed analytics and A/B testing. Plus, there is a Google Analytics Event tracking integration.

Same to the previous plugin, Ninja Popups provides you with such options as:

  • Scroll depth
  • Time
  • Exit-intent
  • User inactivity
  • Click (for two-step opt-ins)

Although the targeting options can be called the rich ones, you will find all the basic options here.

Layered Popups

Finally, let’s move to Layered Popups which is another useful a popup plugin. Shortly, this cool addon comes with a huge template library. It contains more than 200 pre-designed templates. In case you want to customize them or create the new ones, just use Layered Popups’ Visual Constructor.

Talking about targeting and triggering your popups, there’s quite a standard set of options. By tradition, Layered Popups comes with built-in A/B testing and analytics. Among all the features, I want to highlight the ability to embed a WordPress login form in a popup.

This Layered Popups plugin contains the triggers for:

  • Time
  • Scroll
  • User inactivity
  • Adblock users

When it comes to developers, they will get the ability to only run the popups during specific dates and times. As a result, using Layered Popups, you can target:

  • Individual content;
  • Post types;
  • Categories or other taxonomies;
  • Devices.

The Most Popular Mistakes

Well, I hope you already decided which tool you are going to use for your popups. Whatever you have chosen, now it’s time to hear about the most common mistakes. I want you to pay very special attention to this point because even the most experienced users still do these mistakes.

#1 Timing

Let’s start with poor timing! Gently speaking, triggering a popup too soon (or less commonly too late) is still the #1 problem for many users. Without a doubt, timing is an important aspect especially when it comes to popups. Actually, it may be the most crucial aspect because timing influences your prospects directly. Here is how the system works. Your visitors will be disturbing and annoying if the popups will appear too soon. On the other hand, you have big chances to lose new subscribers in case the popups appear too late. So, the question is: which timing is the best to be used for popups?

Although it’s quite a complicated question, I’ll try to give you the answer. Here is what you should know about popups timing.

  1. First things first, it depends on the time a visitor spends on your website. Your popups can only be shown when a person has sufficiently understood your website. He or she should complete all the needed tasks like shopping or researching and only then see a popup.
  2. To figure out what the perfect time for you popup is, you’ll need to take a look at the average time spent on the site. That’s why you need analytics.
  3. According to the stats, today, the best way to show the popup is to set the timing to 60%. Obviously, it comes for the average time spent on your website.
  4. According to Unbounce, your delay should be 60 seconds. It means that if a person has spent 60 seconds browsing the site, “they have already shown an adequate amount of engagement and presumably they understand the main message of your site – and 60 seconds isn’t so much time that you lose a lot of potential subscribers.”
  5. As stated by, it’s better to trigger the offer popup a person had spent at least 15 seconds on the website.

#2 Too Much Info

As the name of the point says, requesting too much info is the next popular mistake. Many beginners make it when creating their popups. And here is how you can fix it.

I want you to clearly understand what exactly you want from a shopper. All in all the less information you ask for, the more visitors will opt-in. Still, requesting such info as age, name, or gender is useful. This step will allow you to create more recipient-oriented emails. When it comes to multi-step popups, (the ones when the visitor only clicks on the first page like YES/NO popup), you can ask people for more information. The first popup is meant to raise the visitors’ interest. Make sure you do not overuse it!

#3 Unprofessional Designs

There’s no doubt, the visual look of your popup influence its success. That’s why your popup should fit the rest of your online project. At the same time, every popup should harmonize with the rest of the page. And it should appear as an integral part of your site. Otherwise, it will be just another ‘layer’ of the website, not a popup.

Another important thing to know: do not put too much text in your popups! It will distract people and kill conversions. Keep in mind this golden rule: less is more.

Final Thoughts

As you can see, there is nothing complicated! In 2019, you won’t need to work with the code in order to create an outstanding popup. What is more, you won’t even need to have any web design experience at all!

To sum everything up, here’s how using popups will improve your customer experience.

  1. Before everything else, using popups can increase social media following. Needless to say, this step will bring your website more social traffic. Actually, cultivating a social media following is a smart way to attract and retain shoppers. This step will increase the web presence of your business. Plus, here is how you can advertise your the latest items and services. To say more, with it, you can even receive business reviews. So, the website popups can and should be used to encourage your prospects to engage with the business through different social media platforms. For these simple reasons, you can add pop up boxes either upon entering or leaving the website.
  2. Next, using popups, you will answer the most frequents customer questions. Honestly speaking, these days, the situations when a prospect has a question but can’t find the answer make one of the common reasons why your potential customers leave the website. That’s why you should study the needs of your clients and answer their questions ASAP. To do it, I recommend you to use web page popups. This is an old good tool to provide the needed info in a fast way. And they will always be just in front of your website customers. For example, it can be a popup that says ‘The Sale Ends In 3 Hours’.
  3. Thirdly, I recommend you to use popups when you are about to promote some free stuff. Needless to say, customers enjoy various freebies. So, in case you have some free products or services that can be useful for the audience, don’t hesitate to promote them!
  4. Besides, this step allows the website owner to collect contact information. It will be helpful for your future engagement with shoppers.
  5. Finally, you can use popups to ask customer’s opinion. There’s no secret that people (and especially skilled shoppers) adore providing their opinions. Thanks to the needed popup, you can create an engaging survey. This feature will not only please the client but will also provide you with important info. Use the last one to understand the needs of your auditory.

I’m falling in love with beautiful website design. I'd like to share my experience and explore something interesting.