Announcement Bar (Static, Carousel, Marquee, Countdown)
What the announcement bar does
The announcement bar shows a message inside your cart drawer. Use it to share things like free shipping info, limited-time sales, or store updates.
Announcement types
- Static message: One message that stays in place.
- Carousel: Multiple messages that rotate (one after another).
- Marquee: A message that scrolls across the bar.
- Countdown timer (optional): A timer that counts down to an end time.
Set up a static (single) message
In the app, go to Cart Editor and open the Announcement Bar section.
Enable the announcement bar, then choose Static (single message) as the display type.
Enter a short message customers can understand fast. Example: “Free shipping over $50” or “Orders ship in 24 hours”.
Select the announcement position (for example: near the top of the cart, above items, or near checkout) if your settings include a position option.
Set up a rotating carousel (multiple messages)
Use a carousel when you want to share more than one message without taking extra space.
In Announcement Bar, set the display type to Carousel.
Add 2–5 messages (slides). Each slide can be a different announcement.
- Slide 1: “Free shipping over $50”
- Slide 2: “Buy 2, get 10% off”
- Slide 3: “Easy returns in 30 days”
Choose how the carousel moves, such as:
- Auto-rotate: Slides change automatically.
- Rotation speed: How long each slide stays on screen.
- Pause on hover (desktop): Stops sliding when a customer hovers.
Set up a scrolling marquee
A marquee is best for one short line that repeats as it scrolls. It can grab attention, but it can also feel busy if it moves too fast.
In Announcement Bar, set the display type to Marquee.
Use one clear sentence. Example: “Today only: 15% off with code SAVE15”.
Set the marquee behavior, such as:
- Scroll speed: How fast the text moves.
- Gap / spacing: Space between repeated text (if available).
- Direction: Left-to-right or right-to-left (if available).
Add an optional countdown timer
A countdown timer adds urgency for limited-time offers. You can use it with a static message or inside a carousel slide, depending on your settings.
Enable Countdown timer in the announcement settings (or inside the message editor, if the timer is per message).
Select the date and time when the timer should end.
Choose the end behavior (if available), such as:
- Hide the announcement when the timer hits zero
- Switch to an “expired” message (example: “Sale ended”)
- Stop at 00:00 (not recommended unless you also change the text)
Styling controls (make it match your brand)
Use styling settings to make your announcement easy to read and consistent with your cart design.
Common style options
- Background color (the bar color)
- Text color
- Font size (keep it readable on mobile)
- Font weight (normal vs bold)
- Padding (space inside the bar)
- Border radius (rounded corners)
- Text alignment (left/center)
Timer style options (if enabled)
- Timer text color and background
- Separator style (if your timer shows “:” between numbers)
- Size (so it doesn’t overpower the message)
Accessibility tip: Use strong contrast (dark text on a light bar, or light text on a dark bar). Avoid neon colors that are hard to read.
Recommended setups (quick picks)
- Type: Static
- Message: Free shipping over $X
- Style: brand color background, white text, medium font size
- Type: Carousel (2–3 slides)
- Speed: 3–5 seconds per slide
- First slide: your most important message
- Type: Static or Carousel
- Timer: enabled, end time set
- End behavior: Hide or switch message
Quick checks if your message looks wrong
- Text is too big on mobile: reduce font size or shorten the message.
- Hard to read: change text/background colors for better contrast.
- Carousel feels too fast: increase the slide time.
- Marquee is distracting: slow it down or switch to Static.
- Timer ended but message still shows: set an end behavior (hide or replace message) if that option is available.