The Announcement bar section lets you display short messages at the top of your storefront. You can use it to highlight shipping updates, promotions, policy notices, support messages, or store announcements.
In Concept, the announcement bar is added inside the Header group and can display messages as a Carousel or Marquee.
How to Set Up the Announcement Bar in Concept
Open the Announcement bar section
From your Shopify admin, go to Online Store > Themes and click Customize on your Concept theme.
In the theme editor sidebar, open Header group and select Announcement bar.
If you do not want to display the announcement bar, you can hide the section by clicking the eye icon. You can also reorder the section or its blocks by dragging the handle icon.
Configure the Announcement bar section
Open the Announcement bar section to configure the main section settings.
Available section settings include:
| Setting | Description |
|---|---|
| Show social media icons | Displays social media icons on desktop. Social links are managed in Theme settings > Social media. |
| Enable language selector | Displays the language selector when your store has more than one language available. |
| Enable country/region selector | Displays the country or region selector when your store has more than one market or country available. |
| Invert icons and selectors | Swaps the position of social icons and localization selectors. |
| Desktop announcement position | Controls the announcement alignment on desktop: left, center, or right. |
| Announcement layout | Choose Carousel or Marquee. |
| Do not show on home page | Hides the announcement bar on the homepage only. |
| Make section full width | Extends the announcement bar across the full browser width. |
| Make section rounded | Adds rounded corners to the announcement bar. |
Choose Carousel or Marquee layout
Use Announcement layout to choose how announcement messages appear.
Carousel
Use Carousel when you want messages to rotate one by one.
Carousel settings include:
| Setting | Description |
|---|---|
| Auto-rotate announcements | Automatically rotates announcement messages. |
| Change every | Controls how many seconds each message stays visible. |
| Show navigation | Displays navigation arrows for switching between announcements. |
Marquee
Use Marquee when you want announcement messages to scroll continuously.
Marquee settings include:
| Setting | Description |
|---|---|
| Direction | Controls whether the text scrolls left or right. |
| Speed | Controls how fast the announcement text scrolls. |
Add announcement messages
Inside the Announcement bar section, add or edit Announcement blocks.
Each Announcement block can include:
| Setting | Description |
|---|---|
| Icon | Adds an icon before the announcement text. |
| Text | Adds the main announcement text. |
| Link | Makes the announcement clickable. |
| Hide icon on mobile | Hides the icon on smaller screens. |
| Text on mobile | Adds optional mobile-specific text. |
| Highlighted text | Applies a highlight style to selected text. |
| Highlighted scribble | Selects the scribble style when using the scribble highlight option. |
The section supports up to 6 Announcement blocks.
To highlight part of the text, select the text you want to highlight in the editor and click the italic I button. Then choose a style from Highlighted text.
Customize colors
Use the color settings to match the announcement bar with your store design.
| Setting | Description |
|---|---|
| Text | Changes the announcement text color. |
| Background | Changes the announcement bar background color. |
| Background gradient | Uses a gradient background instead of a solid color. |
| Highlight | Changes the highlight color. |
| Highlight gradient | Uses a gradient for highlighted text styles. |
Save and preview
After configuring the announcement bar, click Save in the theme editor.
Preview your storefront and check that:
- The announcement bar appears in the header area.
- Announcement messages display correctly.
- Carousel or marquee layout works as expected.
- Links open the correct page.
- Mobile text displays correctly on smaller screens.
- Social icons and selectors appear only when they are enabled and available.
Troubleshooting
If the announcement bar does not appear or does not work as expected, check the following:
- Make sure the Announcement bar section is added inside the Header group.
- Make sure at least one Announcement block has been added.
- Make sure the announcement text is not empty.
- If the bar is missing on the homepage, check whether Do not show on home page is enabled.
- If social icons do not appear, add social links in Theme settings > Social media.
- If the language selector does not appear, make sure your store has more than one language available.
- If the country/region selector does not appear, make sure your store has more than one market or country available.
- If carousel navigation does not appear, make sure there is more than one announcement and Show navigation is enabled.
Need Further Assistance
If you encounter any issues or need additional help with your Concept theme, please reach out to our support team via our Ticket System for assistance within 8 hours.
Share:
Enable right-to-left (RTL) text support
Set up the simple cookie banner for your website