Announcement bar
The thin strip above the header, for shipping offers, promo codes or store notices. Add one Announcement block per message and they rotate; a currency selector, language selector and social icons can share the same row.
At a glance: Already in your theme. Find it in the Header area of the left sidebar, on every page. Holds up to 5 blocks.
Good for
- Free-shipping thresholds and promo codes
- Store-wide notices, like holiday shipping cut-offs
- Giving the country and language pickers a place above the header
Section settings
Behavior
| Enable auto-rotate | Cycles through your announcement blocks automatically. With this off, only the first announcement is ever shown.
Off by default. |
| Rotation speed | How long each announcement stays on screen before the next one slides in.
Adjustable from 1s to 10s (default 5s). Only appears when Enable auto-rotate is on. |
Utilities
| Show currency selector | Adds a country and currency picker at the right of the bar. It only appears when your store sells to more than one country in Settings → Markets.
Off by default. |
| Show language selector | Adds a language picker at the right of the bar. It only appears when your store has more than one published language.
Off by default. |
| Show social icons | Master switch for the social icon row at the right of the bar. Each network also needs a URL in Theme settings → Social media. An enabled toggle with no URL renders nothing.
On by default. |
| Show Instagram | Shows the Instagram icon. It links to the Instagram URL in Theme settings → Social media, and stays hidden if that field is empty.
On by default. Only appears when Show social icons is on. |
| Show Facebook | Shows the Facebook icon. It links to the Facebook URL in Theme settings → Social media, and stays hidden if that field is empty.
On by default. Only appears when Show social icons is on. |
| Show TikTok | Shows the TikTok icon. It links to the TikTok URL in Theme settings → Social media, and stays hidden if that field is empty.
On by default. Only appears when Show social icons is on. |
| Show YouTube | Shows the YouTube icon. It links to the YouTube URL in Theme settings → Social media, and stays hidden if that field is empty.
On by default. Only appears when Show social icons is on. |
| Show X (Twitter) | Shows the X (Twitter) icon. It links to the X URL in Theme settings → Social media, and stays hidden if that field is empty.
On by default. Only appears when Show social icons is on. |
| Show Pinterest | Shows the Pinterest icon. It links to the Pinterest URL in Theme settings → Social media, and stays hidden if that field is empty.
On by default. Only appears when Show social icons is on. |
| Show Snapchat | Shows the Snapchat icon. It links to the Snapchat URL in Theme settings → Social media, and stays hidden if that field is empty.
On by default. Only appears when Show social icons is on. |
| Show LinkedIn | Shows the LinkedIn icon. It links to the LinkedIn URL in Theme settings → Social media, and stays hidden if that field is empty.
On by default. Only appears when Show social icons is on. |
Appearance
| Color scheme | Sets the background and text color for the whole bar. Check contrast if you pick a saturated scheme: the text here is small. |
Blocks
Blocks are the individual pieces inside the section. In the sidebar, click Add block under the section to add one, and drag blocks to reorder them. The order in the sidebar is the order on the page.
Announcement block
Content
| Text | The text content of this block. |
| Link URL | Where this item links to. |
| Open link in new tab | Opens the link in a new browser tab. Best kept for links that leave your store, so shoppers don't lose their place.
Off by default. |
Badge
| Show badge | The badge does not appear on mobile.
Off by default. |
| Text | The short word in the badge before the message, like New or Sale. Keep it to one or two words.
Only appears when Show badge is on. |
| Icon | Upload your own icon image.
Choose Store, Phone, Heart, User, Check, Check circle, Star (default), Lab, Info, Truck, Free shipping, Ruler, Returning, Return, Secure, Credit card, Gift, Tag, Discount, Map pin, Package, Clock, Wallet, Coupon, Award, Barcode, Diamond, Leaf, Apple, Gluten free, Gluten, Vegan, Dairy, Dairy free, No added sugar, Protein, Droplet, Droplet free, Bolt, Moon, Brain, Recycle, Envelope, Chat, Sparkle, Flame, Recurring, Lock, Globe, Calendar, Nut off, Sprout, Arrow right, Arrow up right, Arrow left, Chevron right, Chevron down, Plus, Minus, Cross, Play, Cart, Shopping cart, Search, Link, Download, Home, Hamburger, Edit, Login, Error, Arrow up, Chevron left, Chevron up, Arrow down, Filter, Trash, Share, Eye, Sound on, Sound off, Expand, Copy, Question, Warning, Sticky note, Notification, Swap, List, Grid or Logout. Only appears when Show badge is on. |
| Custom icon | Your own icon, used instead of the preset icon above.
Overrides the icon above. Use a transparent .svg or .png. Only appears when Show badge is on. |
Tips
- Link the offer. Add a Link URL so shoppers can go straight to the promotion. The message text is underlined when it's a link.
- Use the badge for the one message that matters most. A New or Sale badge on every announcement stops standing out.
Troubleshooting
The badge isn't showing on my phone
That's by design. The badge only appears on larger screens so the message has room on small ones.
The language selector is missing
It only appears when your store has more than one published language. Add and publish languages under Settings → Languages first.