Counter

This component allows you to add a section which will display a Countdown clock or Timer, which can be very useful to for example:

• Increase Urgency and Drive Conversions: By displaying a countdown timer, customers feel a sense of urgency to take action before the offer expires. This often leads to faster decision-making and increased conversion rates.
• Boost Visibility of Special Offers: Featuring a clear title, subtitle, and description allows you to highlight special promotions, making them stand out on the page and ensuring customers don’t miss out.
• Improves Time-Sensitive Marketing: Perfect for flash sales, limited-time discounts, or event promotions, the timer helps align your marketing efforts with specific deadlines.
• Increase Click-Through Rates: The inclusion of a link ensures that users who are interested can easily navigate to the relevant page, driving traffic to the desired destination.

By clicking on the component name you will find general options to customize it, which will determine how the section will look and behave. The available options for this component are the following:

Adjust width

Allows to define the width of the container that holds all the elements within the component

When enabled, the following options will become available to be used:

Width

Allows to define the width, based on the following:

• Small: Sets the content width to 75% of the available space.
• Medium: Sets the content width to approximately 83% of the available space.
• Large: Sets the content width to 91% of the available space.

Horizontal position

Allows to define the horizontal position in which the content will be displayed.

---

Counter options

Within this group you will find options to configure the component’s *+clock**.

Title

Title that displays before of the clock.

Date

Mandatory. Here you need to define the Date at which the clock will stop, for example: 2023/06/30 (year / month / day).

When the counter reaches zero (0), the section will automatically hide and will not visible.</p>

Note: Slashes (/) must NOT have spaces before nor after.

Time

Optional. This option will become visible when you add a Date. Here you can define a time at which the timer will stop.

Example: 23:59:59 (hour : minutes : seconds)

Note: Colons (:) must NOT have spaces before nor after.

Border

Allows to display a border all around the clock.

---

Content options

This group includes the settings that let you display additional content to accompany the clock.

Title & Description

These two options will display at the left side of the clock on desktop devices. On mobile devices they will be displayed before the clock.

Link

This option allows you add a link to any page of your store. By adding one, the following options will become available:

• Link text: Text that will be displayed within the button.
• External link: If enabled, the link will open in a new browser tab.
• Outline style: It will display a border around it and a transparent background.
• Arrow in button: displays an arrow icon on the right side of the button text.

---

Appearance

This group contains the following options to customize the component:

• Top margin: allows to control the upper margin of the section.
• Bottom margin: allows to control the lower margin of the section.
• Content colors: allows to choose the Color Pack for the component.

---

Animations

The Customize options allows to adjust the animations for this specific component. You can read which ones are available in this page.