Community forum for knowledge and support

Updated 6 months ago

Overcoming Multiple Modal Popups on the Same Page

At a glance

The community member is having an issue with multiple pop-up modals on the same page. After closing the modal, the trigger buttons are no longer clickable. Another community member provided a video tutorial on how to add multiple modals, but the community member is still having trouble understanding the solution. The key to the solution, as mentioned by another community member, is to ensure that the class selection is set to "All elements with this class" for all the modals, including the first two. After checking this, the issue was resolved.

Useful resources

Hi, does anyone know how to overcome this issue: I want more than one pop up modal on the same page. On the test on the link below, once I close the modal, I can no longer click on any button. Does anyone know why?

https://preview.webflow.com/preview/teste-01e38a?utm_medium=preview_link&utm_source=designer&utm_content=teste-01e38a&preview=46c8a1f201ea987f1eddb08476b04d93&workflow=preview

Big thanks

M
G
4 comments

Hello thank you for your reply. Yes, I watched and rewatched your video many times but I'm not getting it, sorry man rsrsrs. When I copy and paste Contact Modals 3, 4 and 5, all seems fine when directly pasted on Webflow from Relume. Please check

https://preview.webflow.com/preview/teste-01e38a?utm_medium=preview_link&utm_source=de[…]8476b04d93&pageId=66a048b08f21783a075665cf&workflow=preview

Anyways, what I did not understand yet is:

Why the trigger button on Modal 1 and 2 is not clickable after the modal is closed?

What is the best strategy for having multiple modals: duplicate modal class names and interactions or is it possible to have one class/interaction for all modals with the same behavior but different content inside. Thanks

no problem. The key to this is what I show at 6 min mark. You want to make sure that the class selection is "All elements with this class".
https://www.loom.com/share/ec6de49b7c774e569c0bbf822e93b1ec?t=364&sid=e2a3b3ad-98ca-4fc4-a87b-5efef7725ae6

Looks like you've done this for all modals except the first 2. So double check that part and it should be good.

Thanks all set and clear now!

Add a reply
Sign up and join the conversation on Slack