Thank you so much for breaking down the Javascript! I have almost zero working knowledge of Javascript, and this was so incredibly helpful. You've done a great job of explaining the "why" for the different parts, which isn't something I'm used to seeing. Thank you for that!
Thank you !!! I had a problem because my close button was a combo class, so for anyone using combo classes, you are better off just duplicating the original class and changing it accordingly.
Thanks for this, much helpful. I am having problems adding multiple cookies/modals that will remain closed. Could you please explain how you would do this? Thanks
Thanks Nelson! Very useful tutorial as usual. Can the code be used to generate 2 separate cookies? For example one for the "cookie-notice" and one for the "newsletter-modal". Can you show us an example of what the code would look like?
Thank you for making this video Nelson! For anyone who is curious: you can put this into the whole site's code and have your modal on every page (like a cookie notification), so no matter which page a user lands on, they'll see the modal until they click to dismiss it. Once they click to dismiss it, it won't appear on any pages going forward.
can you explain this tom me more detailed. It doesn't work on my site. Seems like I have to close the cookie notice on every page and then it does not show up
doesn't seem to work. "Cookies.set" shows in different colors. Blue for Cookies, White for the period, and green for set. I don't know much about code but i'm pretty sure that means the term Cookies.set is not being recognize as intended.
Hey dude! This is amazing, thank you for creating the video. I'm having an issue though... I followed your steps perfectly and the pop up still shows up. I have set it to animate in (appear) after 61 seconds. Could a webflow-created animation be conflicting with the script?
Hey I find why it's not working for me. All classnames in the code should be lowercase even if You use capital letters in Webflow. forum.webflow.com/t/here-is-how-to-add-cookies-to-a-custom-modal/98956 Pixel Geek explained it here in the comments.
Hi Nelson. Have you experienced any issues with this not working in IE 11? I've used this on a few sites just recently and all of them fail to operate in IE11.
Hi, Nelson! This video was very helpful. Thanks! 👍 My suggestion for the next video is - How to use Tags in webflow? (the list of 10 tags in the Settings panel)
@@pixelgeek Hi! Apologies for the late reply. Well, you could take a few pre-built template pages such as Home, About, Product & Blog page, Contact, FAQ, etc. and explain - which Tag to assign to what element, and why? Since making websites accessible for humans & bots is so important, I think it would be great to have some guidance on this aspect as well. :)
You mentioned briefly about a form submission. Could you update the code to reflect for this to turn off after a form has been submitted for the user? That way it doesn't keep popping up every 7 days or however many you have it set for?
Hi Nelson - Great video - Other question - Would it be possible to have webflow only create a desktop version. So on mobile, you would see a scaled version of the desktop one. Need this option for a client when we're still on Muse. (Or another way not to have to put in the hours in Responsive behavior of all our elements. I hope you have some great insights on this. Thanks in advance! And greetings from Holland!
That is what you call "adaptive design". This isn't a good approach. Here is an article about this that may help you: uxplanet.org/adaptive-vs-responsive-web-design-eead0c2c28a8
hi, this was very help full, but can you please help me understand, i would like to design a popup/a page that asks the website visitor to select a country as they enter the site for the first time, once they select the country i want the data to be saved in their browser and not ask again till they clear their browser data.
Great tutorial as always Nelson - digging all the Webflow content you all have been posting. For some strange reason after following this exactly (I think anyway ;) I can't get the modal to not keep appearing every time I reload the page. Any ideas for troubleshooting this kind of thing would be greatly appreciated...
@@pixelgeek Yeah sorry - the page in question right now is 'Modal' preview.webflow.com/preview/crispina?preview=2ae293eda6b192c2ca68123fdaeec430&mode=preview
![Chino Pacas - Modo Capone (with Drake & Fuerza Regida) [Video Oficial]](http://i.ytimg.com/vi/zjv8TQ0gBkg/mqdefault.jpg)
Thank you so much for breaking down the Javascript! I have almost zero working knowledge of Javascript, and this was so incredibly helpful. You've done a great job of explaining the "why" for the different parts, which isn't something I'm used to seeing. Thank you for that!
my pleasure. glad this video helped you 😁
You, sir - are a good man! You make everything look so simple.
I appreciate that!
Very helpful and clear breakdown! It worked instantly on my site! Thanks
Thank you !!! I had a problem because my close button was a combo class, so for anyone using combo classes, you are better off just duplicating the original class and changing it accordingly.
Finally it works! Thanks man! All clear with the explanation. Keep rocking
Hi the page where the code is to be copied has been deleted :S. Can you tell me where can I get the code from? Thank you
Thanks for filling in the gaps often left out in videos.
My pleasure 😁👍♥️
Thanks Nelson, cool lesson! Where is can find JS code? By the link in the description for full code opens 404 page.(
Thanks for this, much helpful. I am having problems adding multiple cookies/modals that will remain closed. Could you please explain how you would do this? Thanks
Thnk you Nelson! Big help!
Thanks Nelson! Very useful tutorial as usual. Can the code be used to generate 2 separate cookies? For example one for the "cookie-notice" and one for the "newsletter-modal". Can you show us an example of what the code would look like?
Super useful and clear, as usual 🙏🏻
Glad it helped 😁🙇🏽♂️ did you join the community yet? pixelgeek.community
@@pixelgeek Yesssss
Thank you for making this video Nelson! For anyone who is curious: you can put this into the whole site's code and have your modal on every page (like a cookie notification), so no matter which page a user lands on, they'll see the modal until they click to dismiss it. Once they click to dismiss it, it won't appear on any pages going forward.
can you explain this tom me more detailed. It doesn't work on my site. Seems like I have to close the cookie notice on every page and then it does not show up
Thank you very much, your videos are very helpful ;)
Glad you like them!
Hey dude! Another very useful tutorial, thanks!
you're welcome :) thanks for watching.
Hey, great tutorial! can you please post a link to the code again? seems to be broken...
Here it is :)
var cookieName = 'modalClosed';
if(typeof Cookies.get(cookieName) !== 'undefined') {
$('.modal').remove();
}
$('.close-modal-bg, .close-modal').on('click', function(){
Cookies.set(cookieName, 'ok', { expires: 7 });
})
For some reason this doesn't work if there are multiple triggers for the modal on one page. Only works once you move to another page. How to fix this?
Hi Nelson, thanks for the video! Most appreciated :-) I look forward to implementing this 👍
can't wait to see what you do with this tip :)
Thanks so much, Nelson!
my pleasure :) Thanks for watching.
doesn't seem to work. "Cookies.set" shows in different colors. Blue for Cookies, White for the period, and green for set. I don't know much about code but i'm pretty sure that means the term Cookies.set is not being recognize as intended.
Hey dude! This is amazing, thank you for creating the video. I'm having an issue though... I followed your steps perfectly and the pop up still shows up. I have set it to animate in (appear) after 61 seconds. Could a webflow-created animation be conflicting with the script?
Thanks Nelson, this was very useful for me today, and saved me a lot of time ;-)
It somehow doesn't work for me. The modal closes but no cookie seems to be set.
It's not working for me too
Hey I find why it's not working for me. All classnames in the code should be lowercase even if You use capital letters in Webflow.
forum.webflow.com/t/here-is-how-to-add-cookies-to-a-custom-modal/98956
Pixel Geek explained it here in the comments.
Hi Nelson. Have you experienced any issues with this not working in IE 11? I've used this on a few sites just recently and all of them fail to operate in IE11.
The question is, do I need to add this by law? How does Webflow manage cookies? I'm ignorant about this and it's not clear to me.
Great Video! Can you extend this tutorial to show how to create an EXIT INTENT Popup Modal?
Hi, Nelson! This video was very helpful. Thanks! 👍 My suggestion for the next video is - How to use Tags in webflow? (the list of 10 tags in the Settings panel)
good idea for a future video :) I'll make a note of it. Can you show me an example of what you're talking about?
@@pixelgeek Hi! Apologies for the late reply. Well, you could take a few pre-built template pages such as Home, About, Product & Blog page, Contact, FAQ, etc. and explain - which Tag to assign to what element, and why? Since making websites accessible for humans & bots is so important, I think it would be great to have some guidance on this aspect as well. :)
Thanky thanky thank youuu thanks!
You're welcome! 😁
Thank you Nelson!
my pleasure :) Thanks for watching
You mentioned briefly about a form submission. Could you update the code to reflect for this to turn off after a form has been submitted for the user? That way it doesn't keep popping up every 7 days or however many you have it set for?
you could try adding the classname of your submit button in the same place you add it for the close buttons.
Hi Nelson - Great video - Other question - Would it be possible to have webflow only create a desktop version. So on mobile, you would see a scaled version of the desktop one. Need this option for a client when we're still on Muse. (Or another way not to have to put in the hours in Responsive behavior of all our elements. I hope you have some great insights on this. Thanks in advance! And greetings from Holland!
That is what you call "adaptive design". This isn't a good approach. Here is an article about this that may help you: uxplanet.org/adaptive-vs-responsive-web-design-eead0c2c28a8
Does anyone know of a good update for this? Looks like Nelson removed the page where the code was originally hosted.
hi, this was very help full,
but can you please help me understand,
i would like to design a popup/a page that asks the website visitor to select a country as they enter the site for the first time, once they select the country i want the data to be saved in their browser and not ask again till they clear their browser data.
Thank you si much. Thank You so much
This worked perfectly fine but now it's not working anymore and I haven't touched it. Any idea how to fix this?
Does this work on a custom modal trigged on scroll? I can't get it to work and I'm wondering if that is the reason why.
can you reply back with your read-only link and i'll look into it?
@@pixelgeek
preview.webflow.com/preview/red-white-boom?preview=297fe7f17da45e3681b045200d1992b0&mode=preview
Thank you!
The link with the full code is not working 😢
Mega thanks!
you're welcome. :)
Thank you :)
My pleasure 😁🙇🏽♂️
Great tutorial as always Nelson - digging all the Webflow content you all have been posting. For some strange reason after following this exactly (I think anyway ;) I can't get the modal to not keep appearing every time I reload the page. Any ideas for troubleshooting this kind of thing would be greatly appreciated...
Thanks for watching 😁 can you reply with your read only link?
@@pixelgeek Yeah sorry - the page in question right now is 'Modal' preview.webflow.com/preview/crispina?preview=2ae293eda6b192c2ca68123fdaeec430&mode=preview
Thanks a bunch :)
My pleasure 😁👍🙇🏽♂️
Perfect 👍
How do you add different cookies on different divs to offset the expiry timing?
i think you could just duplicate the code and make sure each one has a different cookie name and targeted element.
How to create an auto-populate copyright code for footer?
can you give me an example of what you're talking about?
Script?
Id like to see the copyright auto-detect what year it is without me having to go into dozens of sites and manually changing the © date. See image link: share.getcloudapp.com/X6u29g7A
Hi Brandon!! :D This may help you: forum.jquery.com/topic/get-current-year
Full code link is 404 in description
/video/how-to-webflow-adding-cookies-to-custom-modals