Announcement bar
A thin strip of text at the very top of the page, on every page. One line of text, an optional link, and optional countdown or scrolling.
What it’s for. Saying one thing to everyone, every page, before they’ve done anything. Shipping deals, a buylist plug, a release date, “tournament tonight at 7.” It sits in the header area, so it follows people around the store instead of living on one page.
When to use it. Keep one running with your single most important message. It’s a glance, not a paragraph, so don’t try to cram two offers in. If you have nothing time-sensitive to say, leave it on plain text or turn it off.
Placement. Choose above the header (top of everything) or below it (under your logo and menu).
Countdown and scrolling both attach to the same one line:
- Countdown counts down to a date and time you set (format
YYYY-MM-DD HH:MM). It shows up before or after your text. As it gets close it switches to “Ends today!” with hours and minutes, then “Ends now!” When time’s up, you choose: hide the whole bar, or just drop the timer and leave the message. - Scrolling (marquee) slides the text across in a loop, with a speed slider. Good for a longer line or several quick notes strung together. It pauses when someone hovers.
Ways to use it
- Standing offer — “Free shipping over $50” with a “Shop now” link to a collection.
- Buylist plug — “We buy cards, walk-ins welcome” linked to your buylist page.
- Event countdown — “Lorcana release event” with a countdown to Friday night, set to hide itself once it’s over.
- Drop hype — scrolling text for a preorder window with a countdown riding along.
Tips
- Colors follow your theme’s accent scheme by default, so the bar reads correctly in a light or dark store. The custom background and text color settings override that only if you set them.
- Dismiss is per browser session. Someone who closes it won’t see it again until they come back later, so don’t rely on it for must-see legal text.
- The countdown updates once a minute, not every second. It’s for “3 days left,” not a ticking clock.
- Scrolling respects reduced-motion settings. Visitors who turn off animations get a static, swipeable bar instead.
- Only one announcement bar runs its countdown and dismiss behavior per page. Stick to a single bar.
Settings
| Setting | Type | What it does |
|---|---|---|
| Show announcement | On / off | Default: true |
| Text | Text | Default: Free shipping on orders over $50 |
| Link | Link | — |
| Link text | Text | Default: Shop now |
| Background color | Color | — |
| Text color | Color | — |
| Show dismiss button | On / off | Default: true |
| Placement | Dropdown | Above header, Below header |
Countdown timer
| Setting | Type | What it does |
|---|---|---|
| Show countdown timer | On / off | Default: false |
| Countdown end date | Text | Format: YYYY-MM-DD HH:MM (24h) |
| Countdown position | Dropdown | Before text, After text |
| Hide bar when countdown ends | On / off | Default: false |
Scrolling text
| Setting | Type | What it does |
|---|---|---|
| Enable scrolling text | On / off | Default: false |
| Scroll speed | Slider | Default: 20 |
Was this page helpful?
Spotted something wrong, or want to suggest an improvement? Email support → — your message goes straight to engineering.