A pop-up is a small window that appears, or “pops up”, above a web page, and can be triggered automatically based on various conditions or manually via a hyperlink.
There are many reasons you may want to use a popup overlay for your Divi site, but usually, it is to force attention on a particular piece of content.
This could be to display;
- Email subscription signup or contact forms
- Special offers & deals
- Tool-tips or more info
There are many different options to add a popup modal in Divi including free Divi plugins, premium Divi plugins, and custom-coded solutions without the need for a plugin at all.
Are you looking for the best way to add a Divi popup? In this article, we’ll compare the four most popular ways to add pop-ups to your site.
4 Options for creating a Divi Popup overlay
- Popups for Divi plugin
- Divi popups without a plugin tutorial
- Bloom plugin
- Divi Overlays plugin
1. Popups for Divi plugin
Popups for Divi is a free plugin for creating popup windows that is available on the WordPress.org repository so you can add it via your WordPress dashboard. There are currently 20,000 active installations fo the plugin with an average rating of 4 out of 5 stars.
Once the plugin is installed and activated each section you add via the Visual Builder will have a new “Popup” tab in the settings.
The “Popup” tab has a toggle that allows you to turn the section into a popup modal and assign an ID to use as a trigger for links or buttons.
You can then build your popup within the section using the default Divi modules. There are setting options for closing popup on background click, closing other popups as a new one is activated, opening popup automatically on exit intent.
You can register to a Divi Popups plugin course (in your WordPress Dashboard) that will teach you the basics of creating your first popup, how to customize your popup layouts, and further advanced techniques.
There is a Premium version available called Divi Areas Pro which offers additional features, functionality, and design options.
2. Divi popup without plugin tutorial
This tutorial by Divi Engine will show you how you can create a popup for Divi without using a 3rd party popup plugin. The popup is created using the Divi Builder, CSS, and JQuery.
The tutorial will show you each step of the process which involves adding a Divi button module to trigger the popup and building your popup using a Divi section, rows, and modules as required. You will then need to add CSS to style the popup and jQuery code to allow the button to trigger the popup and add click-to-close functionality to the modal.
The tutorial is available as a blog post on the Divi ENgine website and as a 31 minute YouTube video.
Price – FREE
More information (Affiliate Link)
3. Bloom plugin
If you want to create a Divi popup for gathering email subscriptions, then Bloom is a free full-featured plugin from Elegant Themes designed specifically for email opt-ins. The plugin also works with any WordPress Theme, not just Divi.
The Bloom plugin allows you to integrate an email popup form with 19 of the most popular email marketing systems such as Mailchimp, Aweber, Mailerlite. The form can be built using any of the 100+ pre-made popup templates or you can create your own custom design.
There are six popup types to choose from which include opt-in pop-ups, opt-in fly-ins, inline opt-in forms, below content opt-in forms, widget area opt-in forms, and locked content forms.
Popups can be activated via a preset time-delay, when a user reaches the bottom of a post, after scrolling a set percentage of the page, after commenting on a post or page, after completing a checkout process, or after inactivity.
Bloom comes with a dedicated dashboard for managing and analyzing popup conversion rates. For fine-tuning your campaigns there is also A/B testing built-in.
Price – FREE for Elegant Themes members
4. Divi Overlays plugin
Divi Overlays is a premium 3rd party Divi plugin from Divi Life that allows you to create full-screen overlays, popups, lightboxes, or modals using the Divi Builder.
Like the other methods mentioned, the Divi Overlays plugin uses the Divi Builder to create your popup overlay. This overlay can then be triggered manually with hyperlinks or automatically via a timed delay, scroll delay, or exit intent.
This plugin is available to buy via a number of options including a single site license for $24.00 per year, a 3 site license for $49.00 per year, or an unlimited site license for $79.00 per year. There is a lifetime license that costs $129 and the plugin is also available as part of the Divi Life annual membership plan which costs $149.00 or the lifetime membership which costs $349.00 as a one-off payment.
Price – Starting from $24 per year
More information (Affiliate Link)
Affiliate disclosure* – Links to layouts on Elegant Themes and 3rd party websites may contain affiliate code. You will never pay any extra for using these links. Thanks for supporting Divi Theme Examples.
Which method do you use for popup modals?
There are always a number of different methods to achieve your goals when building a website and there is often no right way to do things. Which method did you choose for adding popups to your Divi website?
If you have any comments on this post or have a live example of Divi popup on your website you are welcome to drop a comment below.