# Countdown timer ![image](https://docs-assets.foxecom.app/sleek-theme/images_TFfTzW7K.png) A countdown clock for promotion/new collection release can bring excitement to customers that have been waiting for the event. ## How to add a Countdown timer Steps 1. In the theme editor **(Customize)**, click **Add section.** 2. Locate **Countdown timer.** 3. Make necessary changes. 4. **Save.** ## How to edit a Countdown timer ### Section settings #### General Adjust the **Container** (Fixed width/Small) and **Color scheme** for this section. ![image](https://docs-assets.foxecom.app/sleek-theme/image_nYsEB8tM.png) Moreover, you can also pick a **Background image** for the timer and set the opacity for it in the **Image overlay opacity** range. ![image](https://docs-assets.foxecom.app/sleek-theme/image_kXpox7d1.png) #### Content settings Change the **Content alignment** (Left/Center/Right) and then align the text inside - **Text alignment** (Left/Center/Right). ![image](https://docs-assets.foxecom.app/sleek-theme/image_Y8nqLgVb.png) #### **Section padding** You can modify the spacing above and below the section by adjusting the slider to change the values of the **Top padding** and **Bottom padding**. ![image](https://docs-assets.foxecom.app/sleek-theme/image_nSxDPfKG.png) #### Section divider This divider line provides a clear boundary between the current section and the above. To activate the divider line, enable the ✅ **Show divider** checkbox. You can choose a suitable **Divider width** for it (Fixed width/ Full width). ![image](https://docs-assets.foxecom.app/sleek-theme/image_9EmLUupM.png) ### Block settings You can choose to add more elements to the Countdown timer section by selecting **(+) Add block**. ![image](https://docs-assets.foxecom.app/sleek-theme/image_2rhtd3vP.png) #### Heading Add the **Heading** of the event to attract customers' attention. * Leave it blank if you do not want to display it. You can also change the **Heading size** to: * Heading xs * Heading sm * Heading md * Heading lg * Heading xl * Heading 2xl * Display md * Display lg * Display xl ![image](https://docs-assets.foxecom.app/sleek-theme/image_yFaxWkRt.png) #### Subheading Add the **Subheading** of the event. * Leave it blank if you do not want to display it. ![image](https://docs-assets.foxecom.app/sleek-theme/image_DKDs1NxE.png) #### Description Add the **Description** to describe the event. * Leave it blank if you do not want to display it. ![image](https://docs-assets.foxecom.app/sleek-theme/image_9T6hFR8A.png) #### Button You can also display a call-to-action button to redirect customers to your desired pages. Add a **Label** and **Link** for one or both, then choose a **Button style** (Primary button/ Secondary button/ Underline button)**.** ![image](https://docs-assets.foxecom.app/sleek-theme/image_ubcghpzH.png) #### Countdown timer Add a countdown timer and adjust the end time of the event. The **Countdown type** offers two modes: * **Evergreen**: A repeating countdown that resets after a specified duration (e.g., every month). * This is useful for recurring sales, daily deals, or subscription cycles. The Evergreen setting is only available in Sleek **version 1.8.0 and above**. ✨ See [Changelog](/sleek-theme/changelog). * **Fixed time**: A one-time countdown that ends at a specific date and time. * Ideal for limited-time promotions, event registrations, or product launches. ![image](https://docs-assets.foxecom.app/sleek-theme/image_nuJN8IB2.png) You can also choose a **Style** for the timer and change the **Number size** to Small/ Medium/ Large. ![image](https://docs-assets.foxecom.app/sleek-theme/image_rHXqYr3V.png) ![image](https://docs-assets.foxecom.app/sleek-theme/image_2wb3OkwT.png) ![image](https://docs-assets.foxecom.app/sleek-theme/image_UbiWzst9.png) If you choose the **Evergreen** countdown, you must specify the **Duration** for when the timer should reset. **Duration** determines how often the countdown restarts. ![image](https://docs-assets.foxecom.app/sleek-theme/image_FLByuynr.png) If you choose the **Fixed time** countdown, you need to specify when the countdown should end. Enter the exact date and time in the **Ends time** field when the countdown should stop. ![image](https://docs-assets.foxecom.app/sleek-theme/image_xUZsYBIY.png) *Date formats accepted:* | Name | Format | Example | | -------------- | ------------------- | ------------------- | | 24 hour format | `YYYY/MM/DD HH:MM` | 2023/10/04 23:30 | | 12 hour format | `YYYY/MM/DD HH:MM` aa | 2023/10/04 11:30 PM | #### Image You can add multiple **Image** blocks in the Countdown timer section on both desktop and mobile screens to attract customers' attention. Adjust the **Desktop Image width** between 150px and 350px. Especially, you are able to change the **Desktop vertical position** and **Desktop horizontal position** for the Image blocks. ![image](https://docs-assets.foxecom.app/sleek-theme/image_9OgmE2wg.png)