Published by: Lisa Glutting

How to Add A Countdown Timer To Your eCommerce Store

Adding a countdown timer to your eCommerce store can help you improve your online sales.

PLEASE NOTE: This feature is only for Shopify Plus stores

What is a checkout page timer?

A checkout page timer is a timer widget that you can add to your Shopify checkout page. Use an app like to add a timer to the checkout page and the sidebar checkout system.

How to Add a Timer to My Shopify Checkout Page

When you are on your dashboard you’ll want to click on the ‘+’ button to add a new widget.

This will open a box that shows you all of the possible widgets you can add to your eCommerce site.

You'll want to expand the 'Increase Urgency' section of widgets and look for the one called “Timer in Cart/Checkout’.

How to edit and customize the holiday countdown timer

Now comes the fun part-customizing your timer to look and act the way you want it to!
The widget is divided into 5 tabs including location, content, design, behavior, and conditions.

Tab #1: Location

This tab lets you decide where to show the content in your Shopify pages. 

You can choose the page or pages for the timer to appear on. By default, this will be on 'shopping cart' as it's a timer meant for the cart and checkout process.

Screen Shot 2020 06 17 At 10.45.22 Am

The 'Location on page" selector allows you to choose where the timer will appear. You can use the drop-down to choose for them to appear: right after, right before, beginning of, end of, or replace a certain section on your site.

You can select the URL to appear.

Once a location is selected your widget will show up in the preview window on the right.

You're also able to add page filters to your widget.

This allows you to show the widget to only those who have come from a referral URL for example, or those with a certain URL param.

Tab #2: Content

This tab lets you choose what content to show to your customers.

The Content tab lets you determine the message to display on your product page(s). Check out this article for editing the timer template.

You'll be able to choose a message to display when the timer is out of time. This is called the 'time-out message'. You can also set a title bar message and choose whether to enable this feature or not.

What this does is add the message to their open tab if they open or are active in a different tab than your site. You can also change the emoji in the messages, check out this article for more help about adding emojis.

You can enable or disable the feature to allow visitors to close the timer bar as well.

Screen Shot 2020 06 17 At 10.48.02 Am

Tab #3: Design

The 'Design' tab lets you choose the colour, size of the font and other details for how the timer will look on your site.

The HTML/Liquid, CSS and JavaScript editors are for your engineers or coders to use if they want to get even more creative in editing and modifying the timer.

Tab #4: Behavior

The 'Behaviour' tab lets you choose the length of time for the timer to count down until. Enable/disable the 'clear cart on timeout' option in this tab too.

Tab #5: Conditions

This tab lets you decide when to show your countdown timer.

You can set specific triggers and conditions here. This is great if you only want the timer to show on certain products (maybe only those in a specific collection are on sale) or to only customers from a certain country.

You can also choose a shopper's journey or the date and time that you want the timer bar to show for.

These triggers and conditions help you customize the cart timer you add to really fit your site's needs.

Screen Shot 2020 06 17 At 10.50.22 Am


We hope this article helps you navigate the Checkout timer and make more sales on your Shopify store!

Get started

Get started in minutes

83% of customers need to see reviews before buying - Add reviews now!