Layout: countdown container block

This block is related to the Image banner section.

Setting	Description
Show container	Enable this option to place the countdown and button on a separate background within the section. If disabled, the countdown and button will be placed directly on top of the section image or video.
Color scheme	Apply color scheme for the countdown container from the available color schemes list. Read 'Color scheme' article to learn more about color schemes.
Background color	In each Color Scheme settings, you can define Background and Background Secondary colors. The Primary and Secondary options here will display the corresponding colors from the active color scheme. Primary – uses the main background color from the selected color scheme. Secondary – uses the secondary background color from the selected color scheme.
Label	Add a label for the countdown.
End date	Enter the end date for a specific promotion. Refer to the example provided below, the field in the theme customizer to ensure the discount period's end date is correctly formatted.
Timer behavior	Stop and show zeroes: The countdown stops and displays `00:00:00` for all units (days, hours, minutes, seconds). Restart when finished (cycle): The countdown resets and starts over from the initial duration, creating a repeating cycle. Hide when finished: the countdown is hidden once the timer reaches the end.
Cycle hours	Set the number of hours for the countdown to cycle when the timer behavior is set to “Restart When Finished (Cycle)”.
Number size	Adjust the size of the days, hours, minutes, and seconds numbers using the slider.
Numbers size mobile	Adjust the size of the days, hours, minutes, and seconds numbers specifically for mobile devices.
Numbers font family	In Theme Settings → Typography → Fonts, you can select a font family from the list and choose the font weight at the end of the list separately for Heading, Body, and Accent text. Based on these settings, each block allows you to choose which font style is applied. Heading Body Accent
Numbers color	Each color scheme includes Heading, Text, and Accent color settings. Use this dropdown to select which color to apply. The available options may vary depending on the selected block color scheme. Heading Text Accent
Days text	Keep the suggested label for days, or write your text in the field.
Hours text	Keep the suggested label for hours, or write your text in the field.
Minutes text	Keep the suggested label for minutes, or write your text in the field.
Seconds text	Keep the suggested label for seconds, or write your text in the field.
Text size	Adjust the text size for days, hours, minutes, and seconds text on desktop devices.
Text size mobile	Adjust the text size for days, hours, minutes, and seconds specifically for mobile devices.
Text font family	In Theme Settings → Typography → Fonts, you can select a font family from the list and choose the font weight at the end of the list separately for Heading, Body, and Accent text. Based on these settings, each block allows you to choose which font style is applied. Heading Body Accent
Text color	Each color scheme includes Heading, Text, and Accent color settings. Use this dropdown to select which color to apply. The available options may vary depending on the selected block color scheme. Heading Text Accent
Button label	Add a label to your button to make it visible. This text shows the button’s purpose or the action it performs. Without a label, the button will be hidden from users.
Button action	Link: Redirects users to a selected page or URL when the button is clicked. Copy code: Copies the provided code to the clipboard when the button is clicked
Button link	To set a button link, you can enter the link URL directly into the “Button link” field or select a page from the dropdown list of options that appears when you click on the field.
Button copy code	Put the code into this field. When the customer clicks the button, they will copy this code.
Button style	Choose the button’s appearance: Primary: The main button style. It uses the primary color from your color scheme. You can choose to fill it with the background color or display it as an outline if the background is set to transparent. Secondary: A secondary action style, using the secondary color from your color scheme. Like the primary button, it can be filled or outlined depending on the background settings. Inline: Minimal style that looks like text with an underline.
Button icon	This setting lets you add a small visual indicator to your button. None: The button displays only the text, with no icon. Dot: A small dot appears before the button label.

Padding

Padding settings are repeated across sections and blocks, which is why they are included in the Global Settings category.

For more details, read these article: Expanded block padding settings

Layout: countdown container block

Image banner section blocks

Padding