# Countdown timer

<figure><img src="/files/Zi6CXMJXLjyPG71wCHNr" alt=""><figcaption></figcaption></figure>

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 section to your Shopify store

{% hint style="success" %}
Steps

1. In the theme editor **(Customize)**, click **Add section.**
2. Locate **Countdown timer.**
3. Make necessary changes.
4. **Save.**
   {% endhint %}

## How to edit a Countdown timer section

### Section settings

#### General settings

Pick a **Background image** for the timer and set the opacity for it in the **Image overlay opacity** range.

<figure><img src="/files/R0fgotfB92BrAeEx3eUQ" alt=""><figcaption></figcaption></figure>

#### Content settings

Change the **Content alignment** (Left/Center/Right) and then align the text inside - **Text alignment** (Left/Center/Right).

<figure><img src="/files/Y8nqLgVbafDnZ3DxarkW" alt=""><figcaption></figcaption></figure>

### Block settings

You can choose to add more elements to the Countdown timer section:

<details>

<summary>Heading</summary>

Give the section a **Heading** and adjust the **Heading size**.

![](/files/MtBXKyz98Nfj06t1eI3M)

</details>

<details>

<summary>Subheading</summary>

Give the section a **Subheading.**

![](/files/oLnZEFN91wohTFyii5ZT)

</details>

<details>

<summary>Description</summary>

Give the section a **Description** and adjust its size.

![](/files/IkkNeJqcnIrwqZJy8mJo)

</details>

<details>

<summary>Countdown timer</summary>

Choose between two countdown types: Evergreen or Fixed time.

* Evergreen: This timer repeats after a set duration.
  * Ideal for:
    * Ongoing promotions (e.g., flash sales every month).
    * Seasonal offers that repeat periodically.
* Fixed time: Counts down to a specific date and time.
  * Ideal for:
    * Product launches.
    * Limited-time promotions (e.g., holiday sales).
  * **Settings:**

    * **Ends time:** Set the exact date and time in the format `YYYY/MM/DD HH:MM` or `YYYY/MM/DD HH:MM AM/PM.`

    <figure><img src="/files/loUivwApnf3FRRqGtYLE" alt=""><figcaption></figcaption></figure>

    <figure><img src="/files/eFke3x7AZ8CLTnRA7t3i" alt=""><figcaption></figcaption></figure>

</details>

<details>

<summary>Button</summary>

Add a Button to link customers to your desired page.

![](/files/C9coNhUYePMPugasLITX)

</details>

<details>

<summary>Image</summary>

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.

:warning: On mobile view, images will be vertically stacked by default.&#x20;

![](/files/qRXjVvu2jPLuThmYU5CO)

</details>

{% hint style="info" %}
Add the following predefined **custom classes** for the image's floating effects:

* media-mover
* media-mover-slower
* media-mover-reverse
  {% endhint %}

<figure><img src="/files/jVfKSwYZu9KCgzv9lfVr" alt=""><figcaption></figcaption></figure>

***

<figure><img src="/files/6RW1JWuKNf9ovVFLkLXc" alt=""><figcaption><p><a href="https://apps.shopify.com/xflow?utm_source=foxecom&#x26;utm_medium=help_center_hyper&#x26;utm_campaign=banner">Install XFlow Back In Stock Automation FREE</a></p></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.foxecom.com/hyper-theme/theme-sections/countdown-timer.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
