Divi Popover Plugin

Create and Manage Divi Popovers with Ease!

This great plugin allows you to create Popovers, Overlays and Modal Content using Divi. You can choose to show your popover with an image, a button, a link click or an exit trigger!

The Divi Popover Plugin uses Custom Post Type and the Divi Builder. 

Custom Post Type

Makes content management easy! Use the power of the Divi Builder, along with the available Divi Modules, to create unique popover content.

Custom Divi Modules

Trigger popovers with Custom Divi Modules. These include an Image Module, a Button Module and an Exit Trigger Module. A link trigger short-code is also available.

Theme Customizer

Use the Theme Customizer to style the popover background, content and close buttons. Now you can make your popover design consistent with your brand style guidelines!

1. Popover Content Custom Post Type

Start creating beautiful popovers for your website with his easy-to-manage post type! The Popover Content Custom Post Type enables you to create and manage all your popover content. Enabling the Divi Builder in the post type means you can use any of the available Divi modules in your layouts.

2. Custom Divi Modules

The Divi Popover Plugin includes three custom modules. Giving you the ability to choose how you want to trigger your popover.

1. The ‘Image Triggered’ Popover Module
2. The ‘Button Triggered’ Popover Module
3. The ‘Exit Intent’ Popover Module

The Image Triggered Popover Module

Use the Image Triggered Popover to trigger a popover on the click of an image. This module is based on the Divi Image module.

In the module settings, ensure that you:

• Setup an image field
• Select your popover from the dropdown. The popover will trigger with content from this item.

The Button Triggered Popover

Use the Button Triggered Popover to trigger a popover on the click of a button. This module is based on the Divi Button module.

In the module settings, ensure that you:

• Setup the button text and styles
• Select your popover from the dropdown. The popover will trigger with content from this item.

The Exit Intent Popover

Do you want to trigger a popover when a user goes to exit a page on your website? The Extent Intent Popover does that for you.

You can control the number of popover displays per session. Also control if you want to show the popover once per page visited. With this handy module you can increase your website user retention, grow your leads and more!

3. Theme Customiser Integration

The Theme Customizer is the default way to style your WordPress website. The Divi Popover Plugin adds Theme Customizer support for styling your popover background, content and the close button.

Styling the Popover Background

Popovers have backgrounds to blur the content below the popover. It helps make users focus on the popover content. The overlay settings Include:

• Ability to set the transparency using the opacity setting.
• Control over the background color

Styling the Popover Content

Set the popover content width and padding using this section.

Styling the Close Button

Set the close button font color and size using this section.

Frequently Asked Questions

• How do I use the Popover Anchor Shortcode?

  The Popover Anchor Shortcode helps to trigger a popover when a user clicks on a link.

  Shortcode usage:

  Tag Name: df-popover-using-anchor-tag

  Attribute details:

  css_id : CSS ID selector to uniquely identify the popover.

  css_class: CSS class selector, incase you want to add generic style to the popover link on your website.

  popover_id: The post ID of the popover content post type.

  fallback_url: In case that popover does no work due to some issue on the webpage, a fallback url. As issue with the webpage is usually caught during development. Ideally this fallback url should never be used.

  anchor_text: The link text.