Skip to main content
All CollectionsCart Designer
Announcement Banner and Countdown
Announcement Banner and Countdown

Setting up the announcement banner and countdown.

Updated over a week ago

EliteCart's Announcement Banner allows you to prominently display important messages, promotions, or countdowns to your customers right in the cart. This eye-catching banner can help boost sales, create urgency, and keep shoppers informed.

For example:

Enabling the Banner

To activate the Announcement Banner, simply go to the EliteCart app settings => Cart Designer and find the "Announcement Banner and Countdown" section. Enable the Banner and start setting it up:

Customizing the Banner Content

The banner gives you two text fields and a countdown to work with:

  1. Primary Text
    This is the main heading or message you want to showcase, like "BLACK WEEK IS LIVE" or "Limited Time Sale". Keep it short, punchy, and attention-grabbing.

  2. Secondary Text (optional)
    Use this for additional details or a call-to-action related to your primary text. For example, "Your cart is reserved for {countdown} minutes" to create urgency.

  3. Countdown: You can enable a countdown timer by entering the desired duration in minutes:seconds format, like 10:00 for a 10 minute countdown. The {countdown} tag in either the primary or secondary text will dynamically update to show the remaining time.

Multi-language store? Don't forget to translate the texts under Language and Translations.

Note that the countdown is just that - a countdown. EliteCart cannot actually reserve any inventory or fulfil other promises. Keep that in mind when using it and making promises to your customers.

Styling the Banner

EliteCart lets you fully customize the banner's look and feel:

  • Position: Choose where the banner appears in relation to the cart contents using the dropdown menu. It can go at the top of the cart, above line items, below line items, or above the sticky cart summary.

  • Text Sizes: Adjust the font sizes for the primary and secondary text fields.

  • Text Colors: Set custom hex color codes for the primary and secondary text.

  • Background Color: Select a background color that makes your text pop.

  • Border Color: Add a border around the banner or leave it clean by disabling borders.

This flexibility allows you to create banners that seamlessly match your brand's style and voice.

Need even more options? Use the Custom CSS section or contact us for help.

How the Countdown works

The countdown starts when the customer first opens the cart or adds something to the cart. It resets every time when the customer navigates to a different page of your store.

Best Practices

  • Use the banner for timely, high-impact messages like flash sales or shipping deadlines

  • Experiment with different text combinations and countdown durations

  • Leverage urgency and scarcity language to drive more conversions

  • Keep the text short and on-point.

  • Ensure your banner looks great on mobile by previewing responsive designs

With its versatile options, the Announcement Banner empowers you to grab shoppers' attention at just the right moment - when they're actively reviewing their cart contents. Use it strategically to boost average order values and conversions!

Did this answer your question?