Announcement bar

Show sitewide messages above your header — free shipping notices, sales, store updates — as a slideshow or a scrolling marquee.

Last updated About 4 hours ago

The Announcement bar is the thin strip above your navigation. It lives in the Header group: open the theme editor and click Header > Announcement bar.

Add your announcements

Each message is its own Announcement block — click Add block to create one. For every announcement you can set:

  • Text, plus an optional Mobile text if you want a shorter version on small screens.
  • A Link, so the whole announcement is clickable — or enable Show button instead to add a small button next to the text.
  • An Icon from the theme's icon library (or upload your own — SVG files work best). You can size it and hide it on mobile.

Choose how multiple announcements display

With more than one announcement, the Announcement style setting decides how they appear:

  • Slideshow shows one announcement at a time. Slides change automatically on a timer you pick (3-6 seconds), or only when visitors click the arrows if you set Slide changes to On click.
  • Marquee scrolls all announcements across the bar continuously. You control the speed, direction, the space between messages, and an optional divider (dot or line) between them.

Both styles pause when a visitor hovers over the bar, so nobody has to chase a moving link. Turn this off with Pause on hover if you prefer.

💡 Tip: Marquee works nicely for short, punchy messages ("Free shipping over $50"). If your announcements are longer sentences, slideshow is easier to read.

Style it

Under Style, pick a color scheme for the bar and set the text size and weight. A color scheme that contrasts with your navigation helps the bar read as its own element.

Add a menu or social icons

The bar can double as a secondary navigation. Under Content, enable Show menu and pick a small menu (great for "Help", "Track order", or store locator links), or enable Show social media icons. These appear alongside your announcements on desktop.

Other settings

Layout — top and bottom padding for the bar.

Visibility — show the bar on all devices, desktop only, or mobile only. See Visibility settings.