Introduction

A countdown timer is a real-time visual indicator that shows how much time remains before a deal, event, or promotion ends. It helps drive urgency, improve engagement, and increase conversions by prompting visitors to act quickly.

Countdown Timer Types

Product Page Timer

Appears directly on product pages to accelerate purchasing decisions and highlight time-sensitive offers.

Top/Bottom Bar Timer

Displays a floating notification bar with a live countdown at the top or bottom of the website for maximum visibility.

Landing Page Timer

Adds urgency to campaign and promotional pages by showing a deadline-driven countdown.

Cart Page Timer

Shows a timer during checkout to reduce hesitation and improve purchase completion rates.

Why Use Countdown Timers?

• Create Urgency

  Highlights limited-time availability, motivating shoppers to act quickly.

• Boost Conversions

  Speeds up decision-making and helps reduce cart abandonment.

• Increase Engagement

  Keeps visitors focused on your promotion while browsing your store.

• Build Trust & Credibility

  Professional-looking timers make your store feel active and reliable.

• Accelerate Purchase Decisions

  Reduces hesitation and encourages faster checkout completion.

• Real-Time Countdown

  Displays live time remaining in days, hours, minutes, and seconds.

• Mobile-Friendly Design

  Works smoothly across desktop, tablet, and mobile devices.

• Flexible Placement

  Can be shown on product pages, landing pages, or in the cart — wherever urgency matters most.

Product Page Timer

The Product Page Timer displays a live countdown directly on your product pages to create urgency and encourage faster purchase decisions. By adding time limits to offers, discounts, or special promotions, it helps increase customer engagement and improve conversion rates. The timer is fully customizable, allowing you to adjust its design, messaging, and behavior to match your brand identity and business goals. It supports time-based campaigns, improves visibility for limited-time deals, and functions seamlessly across all product pages. In this section, you’ll learn how to enable, configure, and optimize the Product Page Timer to enhance the shopping experience and drive better sales performance.

Setup Tab:

Timer Status

The product page timer is currently OFF and is not visible on your storefront.

Turn it ON to activate the timer and display it on eligible product pages based on your configured conditions.

Timer Settings

The Timer Settings section lets you control the text shown alongside the countdown on your product page. You can assign an internal label for easy management and customize the heading and supporting text that customers see.

Timer Name

An internal label used only for your reference. This name is not shown to customers and helps you identify the timer’s purpose.

Title

The main heading displayed above the countdown timer. Use a short, attention-grabbing message to create urgency.

Subheading

An optional line shown below the title to add context or reinforce the message, such as indicating when the offer expires.

Timer Labels

Use this section to customize the text shown beneath each time unit in the countdown timer. Adjusting these labels helps match your store’s tone and overall branding.

Days Label

Text displayed under the Days value in the timer.

Examples: Days, D

Hours Label

Text displayed under the Hours value in the timer.

Examples: Hours, H

Minutes Label

Text displayed under the Minutes value in the timer.

Examples: Minutes, M

Seconds Label

Text displayed under the Seconds value in the timer.

Examples: Seconds, S

Timer Behavior

Configure when the countdown timer operates on your product page.

Timer Starts

Choose when the timer should begin.

• Right Now

  The timer activates immediately after it is turned on.

Countdown Duration

Set how long the countdown should run.

• Minutes

  Enter the total number of minutes for the countdown. For example, entering 120 will display a two-hour timer for visitors.

Timer Behavior

Control when your countdown timer becomes active on your product page.

Timer Starts

Select when the timer should begin.

• Schedule Later

  The timer runs based on the start and end date and time you define.

Timer Schedule

Set the exact timeframe during which the timer will be displayed.

• Start Date & Time

  Choose when the countdown should begin.

• End Date & Time

  Select when the countdown should stop.

Action After Timer Ends

Choose what happens after the countdown finishes.

Hide timer for the buyer

The countdown will be removed from the product page once it reaches zero.

Restart Timer (Available for Right Now)

The timer restarts from the original duration for each new visitor session.

Display a message

Replace the countdown with a custom message to let customers know the offer has ended or direct them to another promotion.

• Message

  Enter the text that will be displayed after the timer expires.

  Example: “This deal has ended, but more offers are coming soon!”

Appearance:

Background Settings

Select the background color for the countdown timer container so it blends seamlessly with your store’s design.

You can choose a color using the picker or enter a HEX value (for example, #FF5733) to apply an exact shade. A live preview updates instantly, allowing you to see how the background will look in real time.

Card Design

Customize the visual style of the timer card to match your store’s look and feel.

Border Radius

Controls how rounded the corners of the timer card appear.

Higher values result in softer, more rounded edges.

Example: 0px creates sharp corners, while 8px gives a gently rounded look.

Border Size

Defines the thickness of the card’s border.

Enter a value in pixels, such as 4px.

Use 0px if you prefer no border.

Border Color

Select the color used for the card border.

Choose a shade using the color picker or enter a HEX value (for example, #000000 for black).

Inside Spacing

Adjust the padding inside the timer card to control the space around its content.

Inside Top

Defines the space between the top edge of the card and its inner content.

Measured in pixels, such as 10px.

Inside Bottom

Controls the space between the bottom edge of the card and its inner content.

Also measured in pixels, for example 12px.

Outside Spacing

Control the space around the timer card to improve layout and visual balance on the product page.

Outside Top

Defines the space above the timer card.

Measured in pixels, such as 15px.

Outside Bottom

Sets the space below the timer card.

Also measured in pixels, for example 10px.

Typography Settings

Customize how the title text appears above the countdown timer.

Title Font Size

Adjust the font size of the title text.

Values are measured in pixels, such as 20px.

Using a larger size helps the title stand out and grab attention.

Title Font Color

Select the color used for the title text.

Choose a shade with the color picker or enter a HEX value (for example, #333333).

For best readability, use a color that contrasts well with the background.

Subheading Size and Color

Control the appearance of the subheading text shown below the timer title.

Subheading Font Size

Adjust the font size of the subheading text.

Measured in pixels, such as 16px.

For best visual balance, use a size slightly smaller than the main title.

Subheading Font Color

Select the color used for the subheading text.

Choose a color with the picker or enter a HEX value (for example, #777777).

Choose a softer shade that enhances the title while keeping the focus on it.

Timer Size and Color

Adjust the appearance of the countdown numbers to make them clear and attention-grabbing.

Timer Font Size

Control the font size of the timer digits.

Values are measured in pixels, such as 24px.

Larger numbers help highlight urgency and draw the shopper’s eye.

Timer Font Color

Select the color used for the countdown digits.

Choose a shade with the color picker or enter a HEX value (for example, #FF0000 for red).

For best results, use a color that contrasts well with the background and fits your store’s color scheme.

Legend Size and Color

Customize the appearance of the labels shown below the timer digits.

Legend Font Size

Adjust the font size of the legend text.

Measured in pixels, such as 14px.

Using a slightly smaller size than the timer numbers helps maintain visual balance.

Legend Font Color

Select the color used for the legend text.

Choose a color with the picker or enter a HEX value (for example, #555555).

Ensure the color is easy to read and works well with both the timer digits and the background.

Positioning:

Select Position

Decide which products in your store will display the countdown timer. This setting allows you to control exactly where the timer appears.

All Products

The timer will be shown on every product page in your store.

This option is ideal for storewide sales or flash promotions and requires no individual product selection.

Specific Products

The timer will appear only on the products you choose.

This is best for targeted or limited-time offers on selected items.

Use the product Selection to add the exact products where the timer should be displayed.

Custom Timer Integration

Enable this option to place the timer in a custom location on your product page using a selector.

Selector Name

Enter the selector you want to use to control where the timer appears on the page.

This allows you to position the timer according to your layout or design requirements.

Top/Bottom Bar Timer

The Top/Bottom Bar Timer is a floating notification bar that displays a real-time countdown at the top or bottom of your store pages. It’s built to immediately catch attention and motivate shoppers to act quickly on time-sensitive offers, flash deals, or special promotions.

You can customize every aspect of the timer bar including its text, design, behavior, and display conditions to align with your brand and sales strategy. Whether you prefer a subtle reminder or a bold promotional message, this feature helps increase conversions by reinforcing urgency as soon as visitors arrive.

In this guide, you’ll learn how to activate, customize, and effectively use the Top/Bottom Bar Timer to improve sales performance and deliver a better shopping experience.

Landing Page Timer

The Landing Page Timer helps increase urgency and improve conversions on dedicated campaign and promotional pages. It’s ideal for use cases like flash sales, product releases, or time-bound offers, where encouraging quick action is essential.

With flexible customization options, you can tailor the countdown to match your campaign’s messaging and visual style. Everything—from text and design to placement and timing behavior—can be adjusted to fit the layout and goals of your landing page.

In this guide, you’ll learn how to activate, customize, and effectively use the Landing Page Timer to drive conversions and improve the overall visitor experience.

Cart Page Timer

The Cart Page Timer adds urgency at the most critical point of the shopping experience—the cart. By showing a live countdown during checkout, it encourages customers to complete their purchase sooner, helping reduce drop-offs and improve conversion rates.

This timer works well for limited-time deals, short hold periods, or urgency-based messaging that pushes shoppers toward action. It’s an effective way to remind customers that time-sensitive benefits won’t last forever.

With full control over content, styling, placement, and behavior, the Cart Page Timer lets you fine-tune the experience and drive conversions when purchase decisions matter most.