Divi Theme Create A Popup Form With No Plugin 👈👈👍👍

[@System22]

Check out our playlist page for more videos on this: kzbin.infoplaylists Sub: kzbin.info/door/Yeyetu9B2QYrHAjJ5umN1Q

[@fbryce1ify]

I did this and it worked!! awesome! thank you.

[@System22]

Fantastic!

[@giuseppelaversa3325]

Well done! This is one of the best tutorials you have ever made!

[@System22]

Glad it was helpful!

[@RajShekhorcoder]

Awesome Thanks.. Best of luck to you.

[@System22]

Glad to help Shekhor Sarker - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!

[@corinnaeichholz]

Amazing tutorial, thank a lot! 🎉

[@System22]

Glad to help Corinna Eichholz - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!

[@markn26]

This is a great tutorial but complete insanity that we have to go through all of this to have something as simple as a modal form. This is a standard feature in practically every other Wordpress premium theme I've used, why is it not so in Divi?

[@System22]

Might want to suggest that to the Elegant themed team @markn26 - Check out our Simple CSS playlist for more videos on this: kzbin.info/aero/PLqabIl8dx2woI_19vOSGFBWZEevx3oSuL - Please like, share and subscribe if you have not done so already - Thanks!

[@miljkomilanovic]

it would be nice if we can dim background and add close button like "X".

[@System22]

I'll look into it when I can Miljko Milanovic - Check out our playlist page for more videos on this: kzbin.infoplaylists

[@htkdesigns6478]

Can i use this for e commerce site? (using catalog mode) instead of add to card button can use for make an inquiry & popup contact form to collect details? Thank you.

[@System22]

Yes @htkdesigns6478 - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!

[@htkdesigns6478]

@@System22 Thank you.i ll try

[@System22]

Awesome!

[@kitziasalgado]

I absolutely LOVED this tutorial!! Thank you!!! I just have one issue. Once I click the button, my pop up module appears at the back of my content. How do I bring it to the front?

[@System22]

Glad to help kitzia salgado - Try changing the z-index, this video may help: kzbin.info/www/bejne/mYXVpYubfc9kbcU - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!

[@ytuser392]

Thank you so much for this tutorial! I would need to make the popup automatically showing on opening my home page, could you suggest how I should do? :) Thanks!!

[@System22]

Glad to help Rina Pizz - Easiest way would be to use Divi supreme plugin as in this video: kzbin.info/www/bejne/pXa8c6t6i8yjqJo - Check out our Divi hover effects playlist page for more videos on this: kzbin.info/www/bejne/a5THm4trrZ5mqdU&list=PLqabIl8dx2wpIaNGilkQCdmr9sJiy72X8 - Please like, share and subscribe if you have not done so already - Thanks!

[@SuwastamaTumbuemasSejahtera]

Thank you for the tutorial, help me a lot. but I have one problem, the close button were cropped out, any suggestion

[@System22]

Not sure why that is Suwastama Tumbuemas Sejahtera - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!

[@chrisc1428]

Hello! Great video, one issue is that my contact form doesn't actually ever pop up. I've changed the z axis settings to be the most prominent but can't see why it isn't working.

[@System22]

Not sure why that is Chris C - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!

[@Ann453lovemusic]

Hi Chrisc1428, I have the same problem it doesn't pop-up, did you ever fix yours? Thanks Ann

[@novovision4080]

@@Ann453lovemusic I had the same problem. Try this code: PREORDER .pbtn { background: #ea01c9; color: #ffffff; border: none; padding: 15px 20px; font-size: 20px; transition-duration: 0.75s; } #popup1 { display: none; } .f1 { display: block !important; } function myFunction() { var element = document.getElementById("popup1"); element.classList.toggle("f1"); }

[@posgoodcom]

@@novovision4080 Why can't the form pop up after pressing the button? Everything else is fine except that the form disappears and cannot pop up when clicked again.

[@Mavenmark]

The form submission thank you message does not go away unless you click the button again, which no one will do. Is there code to make that message disappear after a few seconds?

[@System22]

I'll look into it when I can Ryan Buchanan - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!

[@posgoodcom]

Why can't the form pop up after pressing the button?

[@System22]

Make sre you are using the correct CSS IDs @user-xc8wj3uo1v - Check out our Simple CSS playlist for more videos on this: kzbin.info/aero/PLqabIl8dx2woI_19vOSGFBWZEevx3oSuL - Please like, share and subscribe if you have not done so already - Thanks!

[@posgoodcom]

@@System22 I followed the video every step of the way and corrected it several times, but still couldn’t achieve it. Click to pop up.

[@CyrusSlade]

How can i add a little X button on the popup that closes it?

[@System22]

Glad to help @CyrusSlade - Should be one there by default, it is white so if you are using a white background you will need to change the color of it in the CSS code! Check out our Simple CSS playlist for more videos on this: kzbin.info/aero/PLqabIl8dx2woI_19vOSGFBWZEevx3oSuL - Please like, share and subscribe if you have not done so already - Thanks!

[@carnage1207]

Will this work if there's a separate pop-up, i.e. chatbot, available on the page? I followed the whole tutorial but it's not working. :(

[@System22]

Not sure Cholo D. - Can't think of a reason that it wouldn't! - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!

[@novovision4080]

did you check the code: PREORDER .pbtn { background: #ea01c9; color: #ffffff; border: none; padding: 15px 20px; font-size: 20px; transition-duration: 0.75s; } #popup1 { display: none; } .f1 { display: block !important; } function myFunction() { var element = document.getElementById("popup1"); element.classList.toggle("f1"); }

[@CyrusSlade]

how can i add a little X on the top of the popup that closes it?

[@System22]

Glad to help @CyrusSlade - Should be one there by default, it is white so if you are using a white background you will need to change the color of it in the CSS code! Check out our Simple CSS playlist for more videos on this: kzbin.info/aero/PLqabIl8dx2woI_19vOSGFBWZEevx3oSuL - Please like, share and subscribe if you have not done so already - Thanks!

[@marcofernandez6528]

Amazing! Could you provide the code?

[@System22]

Glad to help Marco Fernández - Unfortunately I can't post the code here because of the pointed brackets - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!

[@novovision4080]

PREORDER .pbtn { background: #ea01c9; color: #ffffff; border: none; padding: 15px 20px; font-size: 20px; transition-duration: 0.75s; } #popup1 { display: none; } .f1 { display: block !important; } function myFunction() { var element = document.getElementById("popup1"); element.classList.toggle("f1"); }

[@posgoodcom]

@@novovision4080 I followed the video every step of the way and corrected it several times, but still couldn’t achieve it. Click to pop up.