Search Divi Modal Popup Documentation
Search for answers or browse our knowledge base.
Configuration
How to use Divi Modal Popup plugin
Adding Divi Modal Popup
Create/Edit a Page/Post that uses Divi builder.
Insert/Edit row (Regular row, not full-width).
Click “Add New Module” and Insert Divi Modal Popup module on a page.
Unique Modal ID
Under the Configuration setting you get this option. Enter the unique modal Id here to make it work perfectly.
Modal Trigger Type
To select modal trigger type, go to the Content tab >> Configuration settings >> Trigger Type >> select either Element, On-Page Load or On Scroll.
Upon selecting Element trigger type, you get various element types that are Button, Image, Icon, Text, Element CSS ID, and Element CSS Class.
Upon selecting the On-Page Load trigger, you get the following two options.
Trigger Delay: Here you can set the time for modal when to appear on the page.
Re-render modal on reloading/revisiting the page: Set as YES if you need to re-render modal on reload or revisiting the page.
Upon selecting the On Scroll you get the option of Scroll Position.
To display modal header, go to Modal Header >> check Show Header as Yes.
To set and display the modal title on the header, go to Modal Header >> check Show Modal Title as Yes, and input text in the Modal Title field.
If you want to display a close icon on the modal header, then go to Modal Header in the content tab >> check Show Close Icon as Yes.
To select modal body content, go to Content tab >> Modal Body >> and select available Modal Content Type >> Text/Image/Video/Divi Library Layout.
To display footer and close button text on the modal, go to Model Footer >> check Show Footer as Yes, and input the text in the Close Button Text field.
If you want to change the background of the Modal, Trigger Element, Modal Header, Body and Footer, go to Background, and apply customization according to the requirements.