Pop Up Modal Cookie Not Working

Design help Custom code
1

Hello Webflow Experts,

I simply want to show an email pop up after 10 seconds but when a user closes it, the pop up does not show for 7 days.

I have followed this video by Pixel Geek - How to Webflow: Adding cookies to custom modals - Tutorial (2019) - YouTube

I have tried everything to fix it and read all of the forums on this topic. Please help!

Thanks,

Jack

Here is my site Read-Only: https://preview.webflow.com/preview/prairiefire-wealth-planning?utm_medium=preview_link&utm_source=designer&utm_content=prairiefire-wealth-planning&preview=1fea8708e42d5132462ec228a10dbe90&workflow=preview

2

To be more specific about the problem - modal continues to show each time I refresh the page. I want the modal to not show for 7 days once a user clicks out of the modal.

I do have an interaction set on the modal to pop up after 10 seconds. I tried removing the interaction to see if it was the problem but it did not work.

Should I use an interaction or should I add code so the modal doesn’t pop up for 10 seconds? I don’t think the interaction is the problem but here is a forum to help if needed - Here is a forum to help regarding the interaction - Set a cookie on interaction

3

hi @Jack_Buttjer I don’t use this library but as there is not value signed and stored in storage I was checking library documentation and according to docs a cookie variable should be capitalized Cookies and you have cookies .

4

Hey @Stan thank you so much for the feedback.

I just made the suggested capitalization change but still not working.

Is there a library you recommend? Or how would you set a 7 day cookie for the modal?

5

hi @Jack_Buttjer I don’t use for cookies any library as I’m using vanilla javaScript. But I had looked on your code and you injecting an old library link. You can try this instead <script src="https://cdn.jsdelivr.net/npm/js-cookie@3.0.0/dist/js.cookie.min.js"></script>

and then double check documentation, your code and if need watch video again. It should work. :wink:

here is link to original jsdelivr page

6

Hey @Stan I replaced the library link and it is still not working unfortunately.

The code and set up is correct so do you have any other suggestions?

@vincent I know you have a tutorial on handling cookies. I tried your version to begin with but it was not working as well.

7

hi @Jack_Buttjer if you still struggle to implement cookies handler and willing to save your time feel free to PM me to talk about my rates.

EDIT: I have now checked your site and it showing (beside other errors) invalid character \u2018 that is a single quote it seems that code was copy pasted from some word editor. The solution will be replacing ALL single quotes to make code readable by browser.

CleanShot 2021-08-10 at 15.16.02
CleanShot 2021-08-10 at 15.16.021121×658 177 KB

CleanShot 2021-08-10 at 15.16.12
CleanShot 2021-08-10 at 15.16.121434×276 92.6 KB

8

@Stan you’re awesome thank you! What do you recommend using to write/edit code in the future? Also are those errors aside from the invalid character having to do with the same script? I’ll PM and pay you to make the changes if they are different.

9

hi @Jack_Buttjer I’m happy to help for free on this forum when possible and if this solved your issue I’m happy I was able to find the problem for you. Most popular code editor is VS Code but is not necessary to use it with WF as you can just write code directly in WF. Just do not copy paste from any word/text editor. :wink:

10

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.