How to trigger a Modal Popup on the click of a Menu Element?

Many a times, you would want to display a popup when a user clicks on a Menu element. You can do this using the Modal popup module that comes with the Ultimate Addons for Beaver Builder.

Here are a few steps you need to follow:

1. Create a new row template by adding modal popup inside it.

2. In Display Settings of Modal Popup, select Custom Class / ID option & enter the unique class name there.

3. Now go to WordPress Dashboard -> Appearance -> Menu

4. Enable the CSS Classes option under the Screen Option settings

5. Add the respective CSS class name ( which you entered in step 2 ) under the selected menu element.

6. Now embed the modal popup site wide
In order to be able to embed a popup and make it compatible with all your themes, we will use the ‘wp_footer‘ hook with a PHP function. You can paste the following code in the functions.php file of your theme / child theme.

function ultimate_modal_popup() {
    echo do_shortcode( '' );
}
add_action('wp_footer', 'ultimate_modal_popup');

You just need to replace your-saved-row-slug with the slug name of your Saved Row template.

Please refer this article to know, how to get the template slug or ID for a shortcode.

This assures that the modal popup you just created, will be displayed on all the pages of your website!