Select Page

How to Make a Popup Divi to Boost Conversions and Lead

by | Jun 25, 2021 | Blogging

Popups have become a staple in digital marketing, and for a good reason—they work. According to studies, well-designed popups can convert up to 40% of visitors into leads. If you’re running a website, especially one built on WordPress using the Divi theme, you have a powerful tool at your disposal to create effective popups that not only capture leads but also drive conversions. This guide will walk you through the process of creating a popup in Divi that’s not just visually appealing but also strategically designed to boost your conversions and lead generation efforts.

Section 1: Understanding the Importance of Popups for Conversions

Why Popups Work

Popups are highly effective because they leverage psychological triggers that compel users to take action. When a popup appears, it disrupts the user’s flow, making it hard to ignore. This interruption, when done correctly, can capture the user’s attention and guide them toward a desired action, such as signing up for a newsletter or downloading a lead magnet. The key to their success lies in their ability to offer value at the right moment, whether it’s to prevent a visitor from leaving the site or to encourage them to complete a purchase.

Types of Popups

Understanding the different types of popups and when to use them is crucial to maximizing their effectiveness:

  1. Exit-Intent Popups: These appear when a user is about to leave the site. They are excellent for capturing leads that might otherwise be lost.
  2. Timed Popups: These show up after a user has spent a certain amount of time on your site, indicating interest and engagement.
  3. Scroll-Based Popups: Triggered when a user scrolls to a specific point on the page, often used to target engaged readers.
  4. Click-Triggered Popups: These appear when a user clicks on a specific element, like a button or link. They are highly effective for offering additional information or opt-ins without disrupting the user experience.

Best Practices for Effective Popups

To avoid annoying your visitors and to make the most out of your popups, follow these best practices:

  • Design: Ensure that your popup is visually appealing and aligns with your website’s branding. Avoid clutter and keep the design simple and clean.
  • Timing: Timing is everything. Don’t show a popup the moment a visitor lands on your site. Give them time to explore before interrupting their experience.
  • Targeting: Show popups only to specific segments of your audience to make them more relevant and effective. For example, display a popup offering a discount to first-time visitors only.
  • Frequency: Limit how often your popups appear to the same user to prevent frustration. A good rule of thumb is to show the same popup no more than once per session.

Section 2: Setting Up Divi for Popup Creation

Installing and Setting Up Divi

If you haven’t already installed Divi, you’ll need to do so to follow along with this guide. Divi is a premium WordPress theme and visual builder that offers immense flexibility and design options, making it ideal for creating custom popups.

  • Step 1: Purchase and download Divi from the Elegant Themes website.
  • Step 2: Log in to your WordPress dashboard, navigate to Appearance > Themes, and click Add New.
  • Step 3: Upload the Divi zip file and activate the theme.
  • Step 4: You can now access the Divi Builder, which you’ll use to create and customize your popup.

Divi Builder Overview

The Divi Builder is an intuitive drag-and-drop page builder that allows you to create complex layouts without touching a single line of code. It’s divided into sections, rows, and modules. Each of these elements can be customized to fit your needs.

  • Sections: The largest building blocks that can be used to group content on a page.
  • Rows: Subdivisions within sections that allow for different column structures.
  • Modules: The individual content elements (e.g., text, images, buttons) that make up your design.

To create a popup, you’ll use these building blocks within the Divi Builder to design a layout that appears as a popup when triggered by a specific action.

Section 3: Creating a Popup in Divi

Step 1: Designing the Popup Layout

Start by designing the layout of your popup. You can either choose from Divi’s pre-made templates or start from scratch. Here’s how:

  • Choose a Template or Create from Scratch: In the Divi Builder, select Add New Section and then Specialty Section. This will allow you to create a full-width section that can serve as your popup.
  • Customize the Layout: Use Divi’s visual builder to add and arrange rows and modules. You can include text, images, buttons, and forms in your layout. Ensure the design is clean and not too overwhelming. Remember, the goal is to make it easy for the user to understand the offer and take action.
  • Tips on Design: Stick to your brand’s color scheme but ensure there’s enough contrast for readability. Use a font size that’s easy to read, and limit the use of images and animations to avoid distracting the user.

Step 2: Adding the Popup Content

Content is king, even in popups. Here’s how to craft compelling content that converts:

  • Headlines: Your headline should grab attention and clearly state the value proposition. For example, “Get 20% Off Your First Purchase!” is both clear and enticing.
  • Call-to-Action (CTA): The CTA button should be prominent and use action-oriented language. Phrases like “Sign Up Now,” “Get My Discount,” or “Download Free Guide” work well.
  • Lead Magnets: If you’re offering something in return for the user’s email, such as a free e-book or discount, highlight this in the popup. This makes the exchange of information feel valuable and worthwhile.
  • Divi Modules: Use Divi’s text modules for your headline and descriptions. Add a button module for the CTA. If you’re offering a lead magnet, use an image module to display a preview of what the user will get.

Step 3: Configuring Popup Triggers and Settings

To ensure your popup appears at the right moment, you’ll need to configure the triggers and settings:

  • Triggers: Divi doesn’t have built-in popup triggers, so you’ll need to use a third-party plugin like Divi Overlays or Bloom by Elegant Themes. These plugins allow you to set triggers such as exit intent, timed delays, or scroll percentage.
  • Frequency Controls: Set how often the popup should appear to the same user. You can usually configure this within the popup plugin settings. Limiting popups to once per session or once per visit is often a good practice.
  • Display Settings: Ensure your popup looks good on all devices by configuring display settings for desktop, tablet, and mobile views. Divi’s responsive design options make it easy to adjust the layout for different screen sizes.

Section 4: Integrating the Popup with Email Marketing Services

Connecting with Email Marketing Platforms

To turn your popup into a lead-generation powerhouse, integrate it with an email marketing platform:

  • Step 1: Choose your email marketing service, such as Mailchimp, ConvertKit, or ActiveCampaign.
  • Step 2: In your Divi popup, add an opt-in form using Divi’s Email Optin module or a third-party form plugin.
  • Step 3: Connect the form to your email marketing service by entering the API key and selecting the appropriate list where the leads will be stored.

Setting Up Lead Capture Forms

The form in your popup is the gateway to capturing leads:

  • Customizing Form Fields: Depending on your goals, you might want to keep the form simple (just an email field) or add additional fields (e.g., name, phone number). However, remember that shorter forms generally convert better.
  • GDPR Compliance: If you’re targeting users in Europe, ensure your forms are GDPR compliant by adding a consent checkbox that users must tick before submitting their information.

Section 5: A/B Testing and Optimizing Your Popup

Why A/B Testing is Important

A/B testing, or split testing, is crucial to finding out what works best for your audience:

  • What to Test: You can test various elements of your popup, such as the headline, CTA text, images, colors, timing, and triggers. Small changes can lead to significant improvements in conversion rates.
  • Setting Up A/B Tests in Divi: While Divi itself doesn’t offer A/B testing for popups, you can use third-party tools like Google Optimize or OptinMonster to conduct your tests. These tools allow you to create multiple versions of your popup and show them to different segments of your audience.

Analyzing Results and Making Improvements

After running A/B tests, analyze the data to determine which version performed better:

  • Metrics to Consider: Focus on metrics like conversion rate, click-through rate (CTR), bounce rate, and time on site. These will give you insights into how effective your popup is.
  • Making Improvements: Based on your analysis, make iterative changes to your popup. For example, if a certain headline performed better, try tweaking the CTA next.

Section 6: Case Studies and Examples

Real-World Examples of Effective Popups

Seeing popups in action can provide inspiration for your own designs:

  • Example 1: An e-commerce site using exit-intent popups to offer a discount code, resulting in a 25% increase in conversions.
  • Example 2: A blog using timed popups to promote a free e-book, capturing over 1,000 new subscribers in the first month.
  • Example 3: A SaaS company using scroll-based popups to offer a free trial, leading to a 15% increase in sign-ups.

Lessons Learned

From these examples, we can extract a few key lessons:

  • Timing is Crucial: The success of a popup often hinges on when it’s shown. Exit-intent and scroll-based popups tend to perform better than those that appear immediately.
  • Value is Key: Whether it’s a discount, free guide, or exclusive content, offering something of value significantly boosts conversion rates.
  • Design Matters: A well-designed popup that’s visually appealing and easy to read can make a big difference in user engagement.

Conclusion

Creating an effective popup in Divi doesn’t have to be complicated. By following the steps outlined in this guide—understanding the importance of popups, setting up Divi, designing a compelling layout, integrating with email marketing services, and continuously optimizing through A/B testing—you can create popups that not only enhance your website’s user experience but also significantly boost your conversions and lead generation.

Remember, the key to success lies in offering value, timing your popups correctly, and constantly testing and refining your approach. So, go ahead, implement these strategies, and watch your conversions soar!

Additional Resources

  • Further Reading:
    • The Complete Guide to Divi Popups
    • 5 Common Popup Design Mistakes and How to Avoid Them
  • Tools and Plugins:
    • Divi Overlays
    • Bloom by Elegant Themes
    • OptinMonster
  • FAQs:
    • How often should I show a popup to the same user?
    • What’s the best way to avoid annoying visitors with popups?
    • How can I ensure my popups are mobile-friendly?

Subscribe to Our Newsletter

Subscribe to our newsletter and get latest updates, tips, and articles right in your inbox.

You May Also Like

Subscribe to Our newsletter

Learn more about marketing tips and strategies, and grow your business. You will get the latest updates and articles right in your inbox.

0 Comments