Announcement bar
Announcement bar shows a message strip above the header. It shows messages in a carousel or a scrolling marquee, and it can show a countdown.
How to find it
In the Theme Editor, select the Header group, then select the Announcement bar section.
Settings
View the section guide .
General
| Setting | Options | Description |
|---|---|---|
| Show close button | Adds a close button on the right side of the bar. When a shopper closes it, a cookie keeps the bar hidden for one day. | |
| Show on home page | When on, the bar appears only on the home page. When off, it appears on every page. | |
| Enable on mobile | Shows the bar on mobile screens. When off, the bar is hidden on mobile and still shows on larger screens. | |
| Announcement type | • Carousel | Chooses how the announcements display. Carousel shows one announcement at a time as slides, and Marquee scrolls all of them in a continuous line. |
| Uppercase text | Shows all announcement text in capital letters. | |
| Text size | • X-Small | Sets the font size of the announcement text to X-Small, Base size or Large. |
Marquee settings
| Setting | Options | Description |
|---|---|---|
| Scroll speed | Sets how many seconds one full scroll takes, so a lower number scrolls faster. Only used when Announcement type is Marquee. | |
| Item spacing | Sets the gap between announcements in the scrolling line. Only used when Announcement type is Marquee. |
Carousel
| Setting | Options | Description |
|---|---|---|
| Show arrows | Shows previous and next arrows on the announcement carousel. Only used when Announcement type is Carousel. | |
| Enable autoplay | Moves to the next announcement automatically. Only used when Announcement type is Carousel. | |
| Autoplay interval | Sets how many seconds each announcement stays on screen before the carousel moves on. Only applies when Enable autoplay is on. |
Appearance
| Setting | Options | Description |
|---|---|---|
| Color scheme | Edit color schemes in Theme settings. |
Section layout
| Setting | Options | Description |
|---|---|---|
| Section width | • Page width | Sets how wide the bar content is. Page width keeps it inside the standard content area, Wide stretches it further, and Full width runs edge to edge. |
| Top padding | Adds space above the announcement text, in pixels. | |
| Bottom padding | Adds space below the announcement text, in pixels. |
Blocks
Announcement (announcement)
Shows a message at the top of the page, optionally with a countdown.
| Setting | Options | Description |
|---|---|---|
| Text | The message shown in the bar. Each announcement block holds one message. | |
| Countdown end time | Enter the end date as YYYY-MM-DD or MM-DD-YYYY, for example 12-29-2026. The countdown ends at 00:00 UTC on that date. | |
| Completion message | Text shown in place of the countdown once the countdown end time has passed. Only used when the announcement has a countdown end time. |
General: Show close button adds a close button to the bar. Enable on mobile hides the bar on phones when it is off. Announcement type chooses Carousel or Marquee. Uppercase text capitalizes the message. Text size sets X-Small, Base size, or Large.
Scroll speed and Item spacing set how the marquee moves. Show arrows, Enable autoplay, and Autoplay interval control the carousel.
The Announcement block takes rich text. Countdown end time sets the end date in YYYY-MM-DD or MM-DD-YYYY format. The countdown ends at 00:00 UTC on that date. Completion message appears when the countdown ends.
Notes
Show on home page is on by default and limits the bar to the home page. Scroll speed and Item spacing apply only when Announcement type is Marquee.
No comments yet