Create a Modal popup in Bricks builder

Author Posts

stephen Jeffers

Hello Sebastian

Would it be possible to show the best way of creating a simple modal popup in Bricks builder, please?

I’m ok with creating a popup by just using CCS only but unsure if I should if it’s best to use javascript. One of the things that I looking to do is to close the modal by clicking on an X icon or close button and the modal background. I’m not sure how to close the modal when a user clicks on the background.

Would it be possible to create a video on how to create a simple modal?

On the bricks builder website, there are over 1000 upvotes for this feature but maybe a while before it’s implemented. I was thinking that Microthemer could be used in the meantime to create a modal.

Many thanks in advance.


Sebastian

Hey,

Thanks for your request. I could create a tutorial for doing this with Microthemer purely in CSS like this method. And also provide some custom JavaScript so that the modal closes when you click outside the modal content area. I should be able do this at some point this week.

Cheers,
Sebastian


stephen Jeffers

Hello Sebastian

That’s brilliant and thanks. It’ll be good for beginners to see your product solve real-world problems no matter which theme is used.

Cheers

Stephen


Sebastian

Hey Stephen,

Just to let you know I haven’t forgotten about this. I’m going to create a general tutorial on creating a CSS only modal popup, with some specific tips for Bricks users if possible – but I’ve noticed that Bricks currently doesn’t support :target selectors due to a custom script it uses for animating page scroll. I’ve raised this with the Bricks author and suggested a potential workaround. Hopefully I’ll hear back at some point.

Cheers,
Sebastian


stephen Jeffers

Hello Sebastian

Not a problem and hope that you had a really good Xmas and new year. I bet it’s been manic for you.

Honesty, no rush.

Cheers

Stephen

You must login or register to reply to this topic.