Skip to content
GloboGlobo Docs
Install app
English

Countdown

Add a countdown timer to the menu for flash sales, launches and holiday deadlines.

Reference Growth Navigation · Pro Navigation 3 min read

A live timer (days, hours, minutes, seconds) counting down to a date you set, with a title and subheading. Use it to create urgency for a flash sale, a product drop or a holiday shipping deadline.

Add the block

  1. Pick a layout

    In the mega menu panel of the preview, click Add block. Click Countdown, hover over a layout and click Select.

    (1) Click Countdown, (2) pick a layout.

  2. Set the texts

    Click the countdown in the preview to open Edit Item. Under General, set the Title, Subheading, an optional Link and the Width.

    (1) Click the countdown in the preview, (2) set its Width.

  3. Set the end

    In the Countdown section, set the End date, End time and When the countdown ends.

    End date, End time and When the countdown ends

  4. Save and publish

    Style it under Styles if you like, then click Save and Publish.

Layouts

Countdown standard
Title and subheading centered, with a large timer under them.
Countdown balanced
Title on the left, timer on the right.
Countdown inline
Title on the left, a compact one-line timer on the right.

Settings

General

Title
The main line, for example “Hurry up!”.
Subheading
The line under the title, for example “Offer ends soon”.
Link
Optional page the block links to.
Width
How much of the mega menu row the block takes: Auto or 8.33% to 100%.

Countdown

End date / End time
When the timer reaches zero, in your store’s time zone (shown under the date). The end must be in the future.
When the countdown endsDefault: Hide the block
Hide the block removes it from the menu. Keep showing zeros keeps it with all zeros. Show a message shows the text you type in Message when ended, for example “This offer has ended”.

Styles

LayoutDefault: The layout you picked
Standard, Inline or Balanced. Changing it resets your custom sizes and colors to that layout’s defaults, so pick the layout first.
Background colorDefault: Transparent
Background of the block.
Title size and colorDefault: 28 / 24 / 18 px · #202223
Size (8 to 96 px) and color. Defaults are for Standard / Balanced / Inline.
Subheading size and colorDefault: 16 / 16 / 14 px · #6D7175
Size and color of the subheading.
Timer size and colorDefault: 40 / 32 / 20 px · #202223
Size and color of the numbers.
Legend size and colorDefault: 14 px · #6D7175
The “Days”, “Hrs” labels under the numbers.

Click Clear settings to go back to the defaults. Visibility works as on every block; see Settings every block has.

Tips

  • Standard needs room for four large number pairs. In columns of 25% or less, lower the Timer size or set Width to 33.33% or more.
  • The timer counts to one fixed date and doesn’t restart. For a new sale, set a new End date.
  • To show the block only during the sale, also use Visibility > Schedule publishing.
  • Pair it with a coupon code so shoppers get the discount code next to the timer.

Was this helpful?

Report an issue