Free Shopify Tool

Free Announcement Bar Generator for Shopify

Build a rotating, dismissible announcement bar for your Shopify store — your messages, your colours, an optional link. Copy the code and paste it in. No app.

  • 100% free
  • No sign-up
  • Runs in your browser — nothing is uploaded

Settings

Live preview

Preview is a mock store — colours and text match the code below exactly.

Widget code

How to add it to your Shopify store

No app, no developer. Takes about two minutes.

  1. Copy the code above. Adjust the settings on the left first — the code updates as you type.
  2. In Online Store → Themes → Customize, add a Custom Liquid section and drag it to the very top of the page, above your header.
  3. Paste the code into that section.
  4. Click Save. That's it — check your live store to see it working.

Prefer it site-wide and always-on? Paste the same code into theme.liquid just before the closing </body> tag (Online Store → Themes → Edit code).

What makes a good announcement bar

An announcement bar is prime real estate — it's the first thing every visitor sees. Use it for one clear thing at a time: a shipping threshold, a sale, a restock, a cut-off date for holiday delivery. If you have several things to say, rotate them slowly (every 4–6 seconds) so each one is readable.

What the generated code does

  • Shows a full-width bar with your message, colours and an optional link.
  • Rotates between multiple messages with a gentle fade.
  • Lets shoppers dismiss it, and remembers that choice for the rest of their visit (session storage — it comes back next time).
  • Pure HTML, CSS and a few lines of JavaScript. No app.

Where to put it

Most themes look best with the bar above the header. Add a Custom Liquid section and drag it to the very top in the theme editor. If your theme already has a built-in announcement bar you like, use that instead and keep this for a second, temporary message.

Frequently asked questions

Quick answers to what people ask most.

Is the announcement bar free?

Yes, free, no app, no sign-up.

Can I show more than one message?

Yes. Add as many as you like and they rotate on a timer you set.

Will visitors see it again after closing it?

Not during that browsing session. It comes back on their next visit.

Where should I paste the code?

Add a Custom Liquid section and drag it to the very top of the page, above the header.

My theme already has an announcement bar, can I use both?

You can, but one is usually cleaner. Keep this one for a second, temporary message.

Can I make the whole bar a link?

Yes. Add a URL in the Link field and the entire bar becomes clickable.