Like all the modules available in Beaver Builder and the Ultimate Addons for Beaver builder, the Modal popup module of UABB can be simply dragged and dropped on the page you wish to use it on.
Let us take a look at the various settings that help us create a good looking and a better performing modal popup.
You’ll find 5 different tabs in the settings window.
- Decide whether you want to enable the Preview of the modal popup in the back end.
- Decide what kind of content will it have; Text, Photo, Video Embed code, Video from YouTube, Vimeo or iFrame.
- Adjust the other popup settings like the background and overlay color, opacity, content width, animation effects and more.
- Decide how you wish to display the popup: automatically (Exit Intent, Well timed), on click of an icon, button, text or an image, or with a class or ID.
- Work on further settings like the anchor text, the text on the button, the icon or image, and the class or ID and the cookie settings too.
Close Button Settings
- Decide whether the close button should be an icon or an image.
Work on the further settings for icons and images.
- Decide whether you want to enable additional methods (clicking on the overlay or through the ESC key) of closing a modal popup.
- Select the Font family, the size and line height of the text you place on the popup.
- Set the margin width
- Set the layout as per the devices the popup will be displayed on.
- Adjust the visibility: always, never or to logged in or logged out users.
- Animation and the delay
- Add CSS selectors if any.
If you are on the agency version of Beaver Builder and wish to create a site-wide modal popup, here is an article you could refer to.