We already told you that we started the year by launching a new product: Nelio Popups, a WordPress plugin to create popups to help you increase the conversion of your visitors.
But why Nelio Popups, if there are already other plugins that offer this kind of functionality? Precisely because our experience using many of the available solutions had been quite frustrating and they did not offer the functionality we were looking for. But in addition, most popup plugins, instead of being fully integrated with the WordPress block editor, are either external tools to WordPress or add a framework with its own popup editor. And this is precisely where we saw the need to create a new plugin:Nelio Popups includes all the features you want when designing popups and takes full advantage of the WordPress block editor.
In this post we will first see what popups are, why they work and the best popup design practices to increase the conversion of your website with Nelio Popups. At the time of writing this post, you already have at your disposal a free version of this plugin, but stay tuned because very soon you will also have the premium version with which you can create all kinds of popups.
Popups: Pros & Cons
As you know, a popup is a window that suddenly appears on top of the content you’re looking at on your browser. Its main goal is to attract the visitor’s attention. You will probably agree with me that, generally, the experience you have with popups is quite negative: you probably perceive them as an intrusive and unsolicited method of getting your attention, right?
What are the main problems with popups?
- They are annoying: finding a popup window when entering a website is very annoying. Who isn’t tired of those popups asking for your consent to add cookies? I know it’s the GDPR and it’s mandatory, but it’s really tiresome, even if it’s only shown the first time a user lands on a website…
- You may lose credibility: if, like me, you have a lot of tabs open, having an exit popup every time you change tabs makes you want to close not only the popup in question, but also the tab.
- You may lose engagement: the popup is specially designed to trigger an impulsive action. This can generate that all leads achieved via popups end up having a much lower level of engagement and loyalty than those achieved by other means.
Even the popup inventor apologized two decades later for developing a product that has spawned a model of unwanted advertising.
This begs the question: if the experience is likely to be negative, why use them at all?
The main goal of your website is to improve your conversion rate, that is, to get more visitors to visit a product details or pricing page, to subscribe to your newsletter, to contact you, to read an article, etc. Several studies have shown that popups can bring you great benefits, especially in getting more leads and subscribers. A study by Sumo showed that the average popup gets a 3.09% conversion rate, and the top 10% of popups get an impressive 9.3% click-through rate.
Why do popups work?
- Everyone sees them and they cannot be ignored: although we have already seen that people do not actually see the banners on your website, popups have a 100% viewing rate because they have to be seen in order to close them. Even once they are closed, you have already been able to convey that message. A 3% figure becomes relevant over time.
- They can be displayed when they’re needed: excluding exit popups, any other well-implemented popup is delivering a message at the exact moment it’s needed; that is, when the visitor is most likely to make a decision.
- They offer value: there are many examples where a popup is offering information the user is interested in. If your popup is offering something of value at the right time, it’s not going to be perceived as an annoyance.
This suggests that, if implemented correctly, popups, rather than generating friction, can boost your marketing efforts by increasing the likelihood that a user will complete the desired action.
How to Create Popups that Work with Nelio Popups
If you want the popups on your website to work and convert, here are some best practices.
#1 Design Your Popup Strategy
Don’t start creating popups on your website just because you read “the convert more.” If used poorly, they can do more harm than good: if, for example, someone is looking at a product pricing page, seeing a popup asking them to subscribe to your newsletter may not only cause them not to subscribe, but also cause them to lose interest in the product they were exploring. Conversely, a user who has just read three articles on your blog will probably appreciate it if you offer them the opportunity to receive your news by email.
The first step in defining which popups make sense on your website to generate more conversion is to understand your website’s conversion funnel and think about which popup can help convert at each of the different stages. For example, if you have an e-commerce, at each of the stages the purchase process goes through, think about which popups can help you to achieve a sale:
- When viewing your products: when your user is analyzing your products to buy, think, for example, if it makes sense to show popups that accompany them to see other related products, or a discount offer on the first purchase.
- When adding products to the cart: after adding products to the shopping cart, some people abandon the shopping cart without completing the purchase. Here, showing a popup when a user is about to leave the page or after a period of inactivity can be quite helpful.
- At or after checkout: what special promotions may interest them to complete the purchase? Does it make sense to offer a complementary product or a discount coupon on their next purchase? The popups that work best are those in which you offer your visitors an unexpected surprise.
#2 Install and Activate the Nelio Popups Plugin
Once you have defined which popups to create, you can start creating them. To do this, use one of the tools available on the market. Of course, we recommend Nelio Popups because, apart from being a plugin created by the Nelio team, it is fully integrated into the WordPress block editor, making the most of the features offered by the editor itself.
To start using it, just install it like any other plugin, downloading it directly from WordPress.org or from your own WordPress dashboard.
After installing and activating it, you will have it available on your dashboard and you will be able to create your first popup with the “Add New” option:
You will then be taken to the same block editor that you use when writing a post or a page, but with the difference that in the right sidebar you will find additional settings for your popup.
Next you will see how easy and versatile it is to create popups. Just add the blocks and patterns you want and design the popup as you like.
Let’s see what properties you should take into account when creating a popup.
Nelio Popups
Fantastic plugin! It’s really easy to create popups as you’re already used to the editor, and all the options it has are really well crafted.
Juan Hernando
#3 Choose the correct format
Let’s start with the popup format: with Nelio Popups we have different options to choose from depending on the size, position, and its animation effect when appearing.
You can opt for a popup window that is a little smaller in size than the window in which it is viewed or that has a fixed custom size or that takes up the full screen size of the window or a responsive size with the proportion you want.
About the position of your popup window, you have many more options. And also, you can choose to display a popup window without any other effect or to have it appear with an animation effect (if you want it to appear from the side and/or in a dimmed form, indicating the delay and the speed of appearance, or if you want it to appear with a zoom effect).
Which format to choose? Well, it depends: although popups that occupy the full screen or appear in the middle and are large can be the most annoying, they are recommended for offering discount coupons to someone who has shown interest in buying your products because, for example, they have already placed a product in the cart. They are also recommended to offer help when they are about to leave your website.
On the other hand, if you want to offer a cross-sell offer that combines with a product in the cart, it will be much more advisable to show that popup, for example, in a much less intrusive way, with a smaller size and on the side or at the bottom of the page.
And for temporary special offers, perhaps it is more interesting to show a banner at the top or bottom of your page.
Additionally, with Nelio Popups you can also add an overlay behind the popup, particularly when you want the person to focus exclusively on the popup.
#4 Show Them in the Right Place on Your Website
If the popup windows are intended to help your visitor perform a certain action, make sure that the window to perform this action is being displayed on the appropriate pages of your website without being an unwanted distraction. With Nelio Popups you can decide if you want your popup to be shown on all pages, or only on certain types of content depending on whether or not some kind of condition is met.
#5 Show Them When It’s Appropriate
When to show a popup is an important issue for them to convert. If a popup appears right after visitors enter your site, especially if they haven’t even had a chance to look at your content yet, you’re basically interrupting their experience and making it worse. Your visitors will subscribe to your Newsletter because they like what you offer them. Maybe it’s better if you give them some time to find out, don’t you think?
To get the correct timing and make sure your popups are relevant, Nelio Popups has different options you can play with: whether the set of elements you have selected has been clicked or hovered over (via CSS), if the page has been viewed, after a certain time, or if it has been scrolled (by scrolling vertically) by a certain percentage on the page.
In addition, with the premium version you can also show a popup when the page is about to be abandoned, or after a certain time of inactivity, or with other advanced rules.
#6 Make Them Easy to Close
It is one thing to nudge your visitors into taking an action, and quite another to force them to. A popup that is difficult to close will surely encourage them not to visit you again.
So, in particular, for those windows that may be annoying since they do not allow you to continue browsing normally, add a button to close the window with the format and position that you think is most appropriate for the popup you have designed. You can also choose to display the close button a little later than when the window is displayed.
But not only do I recommend that you add a button to close it to any popup window, consider closing the window by pressing the ESC key or simply clicking out of it too. Remember that the message you wanted to convey has already been seen and, if your reader is interested in it, she will take the appropriate steps. Otherwise, make the experience of browsing your website as pleasant as possible.
#7 Integrate Them with the Design of Your Website
In the same way that you have taken care that the whole design of your website has a certain style, if your popups follow that same line, it will help the user to perceive them as an organic part of your website, instead of a mere unrelated advertisement.
One of the great advantages of popups created with Nelio Popups is that, being fully integrated with the WordPress block editor, by default you are already using the same theme, templates, patterns, blocks and any other block plugin that you have installed on your website to create any page.
With Nelio Popups the limitation in popup design is the same as when creating any other page. Add cover blocks, buttons, forms, etc, and modify the design as you wish. In addition, to make your popups more attractive, you also have the option of adding a shadow to the popup and/or a border.
#8 Include a Clear Call to Action
The goal of a popup is to get your users to act. Get to the point and add the button or form with a clear message about the action you want them to take. Don’t beat around the bush, as this will only confuse your visitors.
With Nelio Popups, you can add contact forms and buttons just like any other block that you add to your pages.
Conclusion
Take your time to think carefully about what popup strategy makes sense for your website and use a tool like Nelio Popups so that you have designs that will increase your conversion. Our goal in developing Nelio Popups is to offer you a tool so that your popups are naturally integrated into your website, and are perceived as elements that add value to the content you are offering.
I recommend that you take a look at all the features offered by Nelio Popups and don’t wait any longer to try it on your website.
Featured image by Brett Jordan in Unsplash.
Leave a Reply