Re: Countdown timer on password page

Countdown timer on password page

6 0 3

I would like to add a countdown timer to my sites password page. right now my site is password protected so anyone who goes to my site, is unable to enter without a password. I want to add a countdown timer to users who visit the site while its password protected can see the timer to when the site will officially launch. Does anyone know how to do this??

Replies 4 (4)

Shopify Partner
5621 1261 1230

Hello @Jaded-republic 

I would like to give you the recommendation to support you so kindly follow steps below:


1. Go to your Online store > Themes > Edit code
2. Open your password.liquid file
3. Paste the below code :

<p id="demo"></p>

// Set the date we're counting down to
var countDownDate = new Date("Jan 5, 2024 15:37:25").getTime();

// Update the count down every 1 second
var x = setInterval(function() {

  // Get today's date and time
  var now = new Date().getTime();
  // Find the distance between now and the count down date
  var distance = countDownDate - now;
  // Time calculations for days, hours, minutes and seconds
  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);
  // Output the result in an element with id="demo"
  document.getElementById("demo").innerHTML = days + "d " + hours + "h "
  + minutes + "m " + seconds + "s ";
  // If the count down is over, write some text 
  if (distance < 0) {
    document.getElementById("demo").innerHTML = "EXPIRED";
}, 1000);


I hope the above is useful to you.
Best regards,
GemPages Support Team

GemPages - Build any high-converting store pages for any business

- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center
1 0 0

Would you mind explaining how to center the timer on the page as well? Thanks!!

Shopify Partner
580 58 107

Hello @Jaded-republic !

You can add a count-down timer and customize your password page by using the Under Construction - Coming Soon app.

iCart Cart Drawer Cart Upsell App

- If you find the solution helpful, please accept and like it
- To learn more visit

Shopify Staff
824 67 104

Hi @Jaded-republic ,


That’s a great question! Having a countdown timer on your password page can build a lot of excitement for customers that come across your store, eager to see what lies beyond the password page!


Apart from the suggested app, other very popular apps for this function are:
- Fancy Coming Soon
-Pre‑launcher / Coming soon
- Upify ‑ Easy Coming Soon


There also may be other ways this may be written into the code for your theme, as shown by @GemPages. Before you customize a theme, it's a good idea to make a backup copy so that you can discard your changes and start again if you need to.


But if you don’t feel comfortable editing the code, the best bet might be to reach out to one of our Shopify Experts, who you can hire to do almost any custom work on your store. If you were to reach out to them about this query, they would be able to resolve this issue for you.


Considering your store is password protected, I take you’re still working on the setup. Is there anything I can help with? Let me know. Also, take a look at this launch checklist from our help centre that goes through everything that you need to do before launch - it serves as a great guide if you're not sure where to start or what you might be missing.

Iris | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog