Theme Helpcenter

Documentation

Callout banner

timer1.png

About:

The Callout Banner section is a versatile tool for drawing attention to specific promotions, announcements, or key messages on your website. It allows you to combine striking visuals with compelling text and optional features like countdown timers and buttons to engage your audience effectively.

Settings:

Section Layout:

Horizontal: Arrange content and media side by side. Vertical: Stack content and media vertically.

Image Settings:

Image (used to upload the main image for the desktop mode banner). Mobile Image (used to upload an image specifically for mobile devices).

Note: If a mobile image is set, it will be used on mobile devices instead of the main image.

Media Position:

  • Start: Position media at the start of the section.
  • End: Position media at the end of the section.
  • Full: Media covers the entire section.

Content:

Subheading: Add a subheading for the banner. Heading: Add a main heading for the banner.

Heading Size: (can be Small/ Medium/ Large)

Text: Add descriptive text for your callout banner here.

Button Label: (e.g., "Shop Sale") Note: Leave empty to hide the button.

Button Link: Provide a URL for the button.

Button Style: (can be Filled / Outlined / Default)

Common settings:

For the common settings, please access this link

Timer Settings:

Show Timer: Option to display a countdown timer.

Timer Layout: - You can choose between the two styles available (please refer to the theme's customizer)

Timer Size:

  • S (Small): Subtle and compact.
  • M (Medium): Balanced visibility.
  • L (Large): Prominent and eye-catching.
  • XL (Extra Large): Highly noticeable and impactful.

How to set up the timer:

It is important to remember that this is a countdown timer used to show how much time is left until "Promotion starts", or "Promotion ends" - we'll leave that up to you to decide.

So, when setting up the timer, you must decide the year it's going to end, as well as month and day, and you can go as far as selecting the hour and exact minute when that happens:

How to.png

**Timer End Message: ** This should be self explanatory, as you can use it to display the message you wish to display, such as "Use discount code X321RC for 20% discount".

Note: This message will be displayed when the timer ends.

timer2.png

Parts Display Settings:
  • Show Day Part: Option to display the day part of the timer.
  • Show Hour Part: Option to display the hour part of the timer.
  • Show Minute Part: Option to display the minute part of the timer.
  • Show Second Part: Option to display the second part of the timer.

By following these guidelines, you can effectively customize and display a callout banner on your website, ensuring it is visually appealing and aligned with your overall theme design.

Contact Us
Was this article helpful?

Have more questions? Submit a request