Countdown

Section overview

The Countdown section provides a dynamic timer that counts down to a specific date, perfect for creating urgency around limited-time offers, promotions, or events on your Shopify store.

Common use cases

• Highlight time-limited sales or promotions

• Create urgency for product launches or pre-orders

• Display countdown to seasonal events or holidays

• Showcase limited availability for exclusive products

Usage tips

• Set a realistic countdown date that aligns with your marketing campaigns

• Use clear, action-oriented text that explains what happens when the countdown ends

• Include a call-to-action button that directs customers to the relevant offer or collection

• For mobile responsiveness, adjust the width settings for mobile displays to ensure the countdown timer remains legible on smaller screens

• Avoid setting countdowns too far in advance as this may reduce the sense of urgency

• If using an image alongside the countdown, ensure it visually reinforces the promotion's message

Section settings

Setting	Description
Countdown date	The target date that the timer counts down to
Top spacing	Controls the padding space above the section (0-300px)
Bottom spacing	Controls the padding space below the section (0-300px)
Color scheme	Determines the background and text color of the section
Border color	Sets the color of any borders in the section (subtle or strong)
Button color	Determines the style and color of the button in the countdown block
Border position	Controls where borders appear (none, top, bottom, or both)
Vertical alignment	Sets how blocks align vertically within the section (top, middle, bottom)
Visibility	Controls whether the section appears on all devices, only mobile, or only desktop

Block settings

Countdown

The Countdown block displays the main timer functionality with optional heading, content, and button. Limited to 1 per section.

Setting	Description
Heading	The title text that appears above the countdown timer
Content	Descriptive text that provides context for the countdown
Button label	Text displayed on the call-to-action button
Button URL	The destination page when the button is clicked
Desktop width	Controls how much horizontal space the block occupies on desktop (1-12/12)
Mobile width	Controls how much horizontal space the block occupies on mobile (1-12/12)
Horizontal alignment	Sets the alignment of content within the block (left, center, right)

Image

The Image block allows you to add a visual element alongside the countdown timer. Limited to 1 per section.

Setting	Description
Image	The visual to display next to the countdown timer
Desktop width	Controls how much horizontal space the image occupies on desktop (1-12/12)
Mobile width	Controls how much horizontal space the image occupies on mobile (1-12/12)