# Products with timer

The **Products with timer** section highlights a product collection alongside a countdown timer, typically used for flash sales or promotions with a defined end time.

**Preset section** — can be added, removed, and reordered within your page templates.

<figure><img src="https://content.gitbook.com/content/9icwdCUv3B94Yb9tmqHW/blobs/1T0NYZijCASp59ILUcuH/image.png" alt=""><figcaption></figcaption></figure>

***

#### How to Configure the Products with Timer

1. In Shopify admin, go to **Online Store → Themes**.
2. Click **Customize** next to the **Elemento** theme.
3. In the theme editor, navigate to the desired page template (e.g., Home page or Collection page) using the top preview dropdown.
4. In the left sidebar, click **Add section**, then select **Products with Timer**, or locate it if it’s already added.
5. Select the products you want to feature with a countdown timer and configure the timer settings such as end date/time.
6. You can **drag and drop** this section to reorder it on the page.
7. Click **Save**.

#### Section Settings

| **Setting**          | **Type**                                  | **Description**                                                                                    |
| -------------------- | ----------------------------------------- | -------------------------------------------------------------------------------------------------- |
| **Collection**       | Collection selector                       | Choose the collection of products to display in the section.                                       |
| **Heading**          | Text                                      | Title displayed above the product grid and timer.                                                  |
| **Timer end date**   | Text (YYYY/MM/DD HH:MM)                   | Countdown timer end date and time in `YYYY/MM/DD HH:MM` format (24h). Example: `2025/06/01 23:59`. |
| **Background image** | Image uploader                            | Optional background image displayed behind the section.                                            |
| **Button label**     | Text                                      | Label for the button under the product grid (e.g., "Shop Now").                                    |
| **Button link**      | URL                                       | URL for the button (typically the full collection page).                                           |
| **Image ratio**      | Select (Adapt to image, Portrait, Square) | Controls how product images are displayed.                                                         |
| **Color scheme**     | Color scheme selector                     | Apply predefined styling to text and elements.                                                     |

**Section Padding**

| Device      | Setting        | Type  | Description                              |
| ----------- | -------------- | ----- | ---------------------------------------- |
| **Desktop** | Top padding    | Range | Space above the section on desktop view. |
| **Desktop** | Bottom padding | Range | Space below the section on desktop view. |
| **Mobile**  | Top padding    | Range | Space above the section on mobile view.  |
| **Mobile**  | Bottom padding | Range | Space below the section on mobile view.  |

***

**Note:** When the countdown reaches zero, the timer will remain visible showing `00:00:00`. It does not disappear or trigger any action by default.
