Features Breakdown: Advanced Countdown Timer

This section is a dedicated marketing tool designed to create urgency. It features a robust timer engine that handles timezones accurately and offers distinct visual styles, ranging from simple text timers to enclosed card-based designs.

1. Timer Logic & Precision

• Deadline Configuration: Set a specific End Date and Time (YYYY-MM-DD HH:mm).

• Timezone Intelligence:

  • Fixed Timezone: Set a specific IANA timezone (e.g., "Europe/Paris") so the sale ends at the same absolute moment for everyone.

  • Visitor Timezone: Option to use the visitor's local browser time (e.g., for "Midnight in your country" deadlines).

• Completion Actions: Choose what happens when the timer hits zero:

  • Hide Section: The entire section disappears automatically.

  • Show Message: Replaces the timer with a customizable Rich Text message.

2. Visual Style: Cards & Digits

• Card Shapes: Choose between Standard Cards (rounded rectangles) or Round Cards (perfect circles).

• Styling: Full control over card background color, text color, corner radius, and minimum width to ensure consistency.

• Mobile Optimization: Specifically engineered to force the countdown into a Single Line on mobile devices, preventing stacking and saving vertical screen space.

• Separators: Customizable colon (:) separators with independent size and color controls.

3. Layout layers & Backgrounds

• Outer Backdrop: An optional "Outer Wrapper" that encapsulates the section. It supports Gradients (linear, customizable angle), solid colors, rounded corners, and soft drop shadows to make the section "pop" from the page background.

• Inner Box: An optional secondary background box immediately surrounding the timer digits, perfect for creating contrast.

• Alignment: Align the Text Header and the Countdown independently (Left, Center, or Right).

4. Typography & Labels

• Granular Sizing: Independent pixel-perfect font size controls for Desktop and Mobile for:

  • Main Heading & Subheading.

  • Timer Digits (Values).

  • Timer Labels (Days/Hours/Min/Sec).

  • Separators.

  • Completion Message.

• Label Customization: Editable text for all time units (Days, Hours, etc.) with an option to force Uppercase text.

• Font Source: Use the Theme's global typography or force specific Custom Fonts for headings and body text.

5. Container & Spacing

• Width Control: Three modes for both Desktop and Mobile:

  • Theme Page Width: Matches the site's default layout.

  • Container: Standard width.

  • Custom: Define a specific maximum width (px) and padding for precise alignment.

• Vertical Spacing: Adjustable top and bottom margins.

6. Accessibility

• Screen Readers: Includes hidden ARIA labels and live regions to announce the time remaining and the "Finished" state to visually impaired users.