Skip to content

Evergreen Countdown

The Evergreen Countdown module adds a countdown timer to any page. It has two modes: a fixed date that every visitor counts down to together, or an evergreen timer that starts fresh for each visitor. Use it for product launches, event deadlines, limited-time offers and enrollment windows. It works in Divi 4 and Divi 5.

Divi countdown timer showing separate boxes for days, hours, minutes and seconds with labels beneath each number

See the Evergreen Countdown demo.

How to add the Evergreen Countdown module

  1. Open a page with the Divi Builder and add a section and row.
  2. Click the + icon, search for Evergreen Countdown, and insert it.
  3. Choose a Countdown Type, then set either the due date or the evergreen duration.

Content Tab

Timer

Countdown Type is the first decision. It changes which of the remaining fields apply.

  • Fixed Date: Every visitor sees the same ending time. Set Due Date in the format 2026-12-31 23:59:59. Use this for a real event, such as a webinar, a launch or a sale that genuinely ends.
  • Evergreen: Each visitor gets their own countdown, starting from the moment they first land on the page. Set the length with Evergreen Hours (24 by default) and Evergreen Minutes (0 by default). Use this for an always-on offer.
  • View: Block stacks each number above its label. Inline puts them side by side.

A fixed date is resolved against your site's timezone, set under Settings > General in WordPress. It is not the visitor's local time. Check that setting before you publish a launch timer.

An evergreen countdown is stored in the visitor's own browser (in localStorage), which lets each person see their own deadline. It is remembered per page. Three things to know:

  • A visitor who returns after the deadline has passed sees the expired state, not a fresh timer.
  • A visitor who clears their browser data or opens the page in a private window starts over.
  • Changing the evergreen duration in the module settings starts a new window for everyone.

Units & Labels

  • Show Days, Show Hours, Show Minutes and Show Seconds: Each unit has its own toggle. All are on by default. Hide days on a timer that never exceeds 24 hours.
  • Show Labels: Displays the word under each number. On by default.
  • Custom Labels: Turn this on to replace the default labels, then set the Days Label, Hours Label, Minutes Label and Seconds Label individually. Use it to translate the labels or shorten them to "d / h / m / s".

When Expired

When Expired decides what happens the moment the timer reaches zero.

  • Do Nothing: The countdown stays on the page showing zeroes. This is the default.
  • Hide Timer: The countdown is removed from view.
  • Show Message: The timer is replaced by the text you set in Expiry Message, for example "This offer has closed."
  • Redirect: The visitor is sent to the URL you set in Redirect URL.

Design Tab

Boxes

  • Box Background: The fill color behind each unit.
  • Spacing Between Boxes: The gap between the units, 0 to 100px. Default is 16px.
  • Box Padding: Padding inside each box, entered as top|right|bottom|left. Default is 16px|16px|16px|16px.
  • Number/Label Spacing: The gap between each number and its label.

The standard Divi Border and Box Shadow options also apply to the boxes, so you can round the corners or lift each unit off the background.

Numbers and Labels

The numbers and the labels each have their own typography group, named Numbers and Labels. Keeping them separate lets you set large bold numbers above small uppercase labels.

Tip

Use a fixed date when the deadline is real, and evergreen when it is not. The deadline sticks in each visitor's browser, so give the expiry a real consequence. Set When Expired to show a message or redirect, rather than letting the offer quietly continue at zero.

Frequently asked questions

What is the difference between a fixed-date and an evergreen countdown?

A fixed-date countdown points at one moment in time. Every visitor sees the same remaining time and it hits zero once. An evergreen countdown gives each visitor their own timer starting when they first arrive. Two people opening the page a week apart both see a full countdown.

Which timezone does the countdown use?

Fixed dates resolve against your WordPress site timezone, configured under Settings > General. The date you enter is interpreted in that timezone, not in each visitor's local time. A timer set to end at 23:59:59 ends at that moment site-wide.

What happens when the timer reaches zero?

That depends on When Expired. The countdown can sit at zero, be hidden, be replaced by a message you write, or redirect the visitor to another URL. An expired evergreen timer stays expired for that visitor. A new window only starts if you change the evergreen duration in the settings, or if the visitor clears their browser storage.

Does the countdown work in Divi 5?

Yes. The module is a native Divi 5 module and it also runs in Divi 4. The View setting (Block or Inline) and Number/Label Spacing are available in both.