How to open a pop-up from a Header Menu ?

[Jeriss Cloud Center]

Dear,

In my page, I have some buttons like below :

“Découvrir la carte”
“Réserver une table”
“Commander une livraison”

Those buttons are intended to open a pop-up with a specific form, and that works fine inside the body.

However, in the Header, I want to add links that open those pop-ups. But I’m not able to do that.

I tried creating HTML block but when I add those HTML Block in the header, it redirects the user to the HTML Block page => I don’t want that.

I want to open those header links as a Pop-Up. How can I do that?

Thanks

• This topic was modified 1 year, 11 months ago by Jeriss Cloud Center.

Attachments:

You must be logged in to view attached files.

Hello,

Actually, the Popup on button under the Theme shows with the usage of the theme element “Popup” but that element isn’t available to add it under the Theme which is why the change that you are trying to achieve here wouldn’t be possible because the element isn’t available to add under the Header Builder.

It requires Customization and this is beyond our limitations and support policy scope. Hope you can understand our limitations.

Best Regards.

So there is no way at all to open a pop-up from a Header ?

Hello,

Unfortunately, to open a Popup from a Header wouldn’t be possible but on any other page you can use the Theme’s Popup element to achieve that.

Best Regards

You can accomplish this if you have Elementor Pro (you could also use a plugin specifically for popups)

Here is how to do it with Elementor Pro:

Go to Elementor > Templates > Popups > Add new

Build your popup.

Go to popup settings (in the builder, the bar at the bottom with the update button, settings option is on the left > Advanced Tab > Advanced > Open by selector

Now add this to create a link to your popup a [href=”#my-popup”] (obviously change the #ID to what you want.

Now set the display conditions for your popup to entire site, you probably won’t want to set any triggers.

Save

Now exit and go to Appearance > Menus

Select your menu and add a custom link

In the URL field add the #my-popup (or whatever you set)

Save menu.

Now go try it out, the popup should open when you click the link in the header menu.

@maltgeorge

Thanks for your reply! I’ll try that!

Hello,

@maltgeorge:
Thanks for sharing your suggestions with other Customers. Appreciate that 👍

@Jeriss Cloud Center:
You can try the solution provided by maltgeorge, if it could be of some help to you.

Best Regards

[Author]

Posts