Countdown Page


I want to create a Countdown Page. Can you suggest how to implement this? Thank you in advance :slight_smile:


I was thinking about the same. Searching at the brics but couldn’t find it.
Something like that would be nice


There is no bric as such and I agree it would be useful. You may find something here that can work for you.


Thanks for the link.
I’ll have a look, but the last time I searched for it it was always at least a HTML + Javascript. I didn’t find a pure HTML one, which would naturally be the easiest to integrate for poor buddies like me we can’t code :slight_smile:


@mackyangeles , @Eldar has one in his Event Template. Maybe he could share where he found it and how he implemented it.



Which template are you talking about?
I can’t find one with a countdown:




LOL. I missed it! Thanks.
Yes, it would be great. Usually Eldar is pretty cool to share info. Let’s wait for his reply :slight_smile:


Hi guys,

@casey1823, thanks for mentioning me!
@Muppet and yes, I am always happy to help!

So, below is the video explaining how I have done it, and under the video is the code I used. I actually think I found it on the same site as you have mentioned above.

Video Explanation:

Code for script:

// Set the date we're counting down to
var countDownDate = new Date("Jan 28, 2019 00:00:00").getTime();

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

    // Get todays 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 + " days  " + hours + " hours  "
    + minutes + " minutes  " + seconds + " seconds ";
    // If the count down is over, write some text 
    if (distance < 0) {
        document.getElementById("demo").innerHTML = "EXPIRED";
}, 1000);

The code for the timer itself:

<meta name="viewport" content="width=device-width, initial-scale=1">
h2 {
  text-align: center;

<h2 id="demo" class="tc-2 tc-1566"><p></p></h2>


I’m curious why the code goes in the analytics section and whether this will change with the update due in 3.1 for the code editor?


This way it is added to all pages at once. It’s not necessarily to add it there though. I think page settings will also work.

And yeah, I hope in Blocs 3 it will be easier to add code to the global header and footer.


I think Norm said yesterday that the code editor is receiving an upgrade with 3.1 and the first beta is due next week. I have always found the options for adding code in Blocs rather confusing, so I am hoping it will become clearer.