Streaming live at 10am (PST)

Newsletter Pop Up Issues

Hi Guys,

I have designed a modal for my site to get newsletter subscription from visitors.
The idea is to have it pop up after a certain amount of time and only once on a specified time frame.

I used a custom code found a the web that would normally do the job and pasted it on my site. Sadly, it doesn’t work.

I have multiples clues on the possible issues:

  • the code I found was on a 2018 page. Maybe the script source is now out of date…
  • the modal is a flexbox but the code use the show() command to make it pop. Maybe it is not the suitable command to use…
  • the custom code is added on the “Before tag” field in Webflow but I had another custom code already there for my site translation. Maybe I am not formatting the code properly (script tags)

But there is maybe another explanation for this issue…

Here is the code I used:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js"></script>
<script>
$(document).ready(function(){
  window.interval = 5 * 1000; // milliseconds.
  window.poll_interval = 5 * 1000; // milliseconds again
  var now = Date.now(); 

  function checkPopup() {
	var now = Date.now(); 
    console.log((90 - ((now - $.cookie('alert-timer')) / 1000 )) + "s till popup" );
 	if(!$.cookie('alerted')) {
	  	if ((now - $.cookie('alert-timer')) >= window.interval) {
	    	$('.modal-newsletter').show();
	    	$.cookie('alerted', true, { expires: 7});
          	console.log("I popped up mom");
	    	clearInterval(window.poller);
	  	}
	  }
  }

  if (!$.cookie('alert-timer')) {
    $.cookie('alert-timer', now, { expires: 7 });
  }
  
  // Check every 3 seconds
  window.poller = setInterval(checkPopup, poll_interval);
});
</script>

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Anyone ? Looks pretty basic for someone with a bit of experience in custom code

Yes, it is on the first post :slight_smile:

https://preview.webflow.com/preview/mooqtrees?utm_medium=preview_link&utm_source=designer&utm_content=mooqtrees&preview=8a6379e43e5debee1a6b2523ac2c1969&mode=preview