Personalized checkout and custom promotions with Shopify Scripts
Hi! I need to redirect a user from home page (page with countdown) to a catalog when the timer runs out. I already got the timer working and it redirects the user but the page refreshes again and again, but when I redirect user to a google.com it doesn't do that.
js
<script> const countDown = () => { const countDate = new Date('December 2, 2021 11:25:00').getTime(); // CHANGE THE TIME TO A DROP COUNTDOWN const now = new Date().getTime(); const gap = countDate - now; // Calculations for Time const second = 1000; const minute = second * 60; const hour = minute * 60; const day = hour * 24; // Calculate missing days const finalDay = Math.floor(gap / day); const finalHour = Math.floor((gap % day) / hour); const finalMinute = Math.floor((gap % hour) / minute); const finalSecond = Math.floor((gap % minute) / second); document.querySelector('.day').innerText = finalDay; document.querySelector('.hour').innerText = finalHour; document.querySelector('.minute').innerText = finalMinute; document.querySelector('.second').innerText = finalSecond; if(gap < 10000){ window.location.replace("/products"); //PRODUCT SITE (site you want to redirect user when countdown hits 0) } }; setInterval(countDown, 1000) </script>
Solved! Go to the solution
This is an accepted solution.
That's correct. But you can't add custom code inside index.json. But you can put it inside the section file that displays the countdown.
Another solution to keep the code inside theme.liquid is to wrap the code in a conditional statement. Here's how:
{% if template.name == 'index' %}
... your JS code here ...
{% endif %}
This will limit your JS code to the homepage only.
Hey, I can think of two solutions here
To accomplish this, you'll need to add a flag in the browser once a redirect happens.
To overcome this, you just need to include the Javascript code on the homepage which will fix your catalog page getting redirected to itself.
Let me know if you want the first solution, I'll revise the code to accomplish the solution.
Oh, I think that could be it, the code is on the theme.liquid, so I need to delete this code and paste it into index.json to work only on the home page?
This is an accepted solution.
That's correct. But you can't add custom code inside index.json. But you can put it inside the section file that displays the countdown.
Another solution to keep the code inside theme.liquid is to wrap the code in a conditional statement. Here's how:
{% if template.name == 'index' %}
... your JS code here ...
{% endif %}
This will limit your JS code to the homepage only.
Thank you very much, you are a lifesaver
User | RANK |
---|---|
4 | |
3 | |
2 | |
1 | |
1 |
On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...
By Arno Nov 27, 2023You've downloaded the Search & Discovery app from the Shopify App store, and as you're ...
By Skye Nov 8, 2023The year-end shopping season is just around the corner. Is a flash sale on your radar? Are...
By Jasonh Nov 6, 2023