Countdown offer

What to watch for. Look at the bar at the top of the window. The seconds are moving. It is counting to a real date three days out, in the visitor’s own clock.

A countdown is an element, not a format

That distinction is worth making, because it means the clock can go anywhere any other element can: in this bar, in a modal, in a slide-in, in a mat, or inside an inline block halfway down an article. The countdown here happens to sit in an announcement bar because that is where a sale deadline belongs.

It renders server-side with the date already in it, then a very small script takes over and keeps the numbers moving. If that script never runs — an old browser, a blocked file, a failed deploy — the visitor still sees a sensible, correct time remaining rather than an empty box.

Two kinds of clock

A fixed countdown runs to a date you set, and every visitor sees the same remaining time. That is this one, and it is the honest kind: the sale really does end on Friday.

An evergreen countdown starts when a particular visitor first sees it and runs for a fixed duration from there. It has its uses — a genuine trial window, an onboarding sequence — and it is also the one that gets abused, with a “sale” that resets forever. The plugin will build either; which one you deserve is up to you.

What happens at zero

You choose. The campaign can hide itself, swap the clock for a message, or leave the expired state on screen. This one shows a message, because a bar that silently vanishes leaves people wondering whether they imagined it.

The timer is computed from the visitor’s own clock against a fixed UTC moment, so it is right in every time zone without the server being asked a single question — which is the only way a countdown can survive a full-page cache.

How this one is set up

• Element: countdown, fixed end date
• Carried by an announcement bar
• Rendered server-side, then ticked in the browser
• Shows a message once it expires
• Correct in every time zone
• Elements: text, countdown, button