.png){kind=logo}
Announcement bar
The Announcement bar section allows you to display important short messages or promotions at the top of your store. Use this section to highlight sales, special offers, and important updates, and to provide links to specific areas. Up to three short announcement messages can be added.
How to add announcement banner section
.svg){kind=icon}
- Access the Theme Editor: Navigate to `
Online Store > Themes > Customize`. - Add a Section: Click on `
Add section`and select the desired section from the list of available sections. - Customize Your Section: Adjust the settings such as display type, alignment, and visibility according to your preferences.
If you need a more detailed, step-by-step guide on accessing the theme editor, adding sections and blocks, refer to our Setting up theme sections and blocks article.
General section settings
Within this section, you'll find common settings like containers, visibility options, and color settings that are consistent across all sections. For more detailed information on these shared settings, please refer to the Common settings between all sections article.
Unlike the other sections that contain a section header, this particular section does not include one.
Section Settings
- Show Country/Region Selector: Display a country/region selector for customers.
- Show Language Selector: Enable customers to switch languages.
- Show on Home Page Only: Limit the announcement bar to the homepage.
- Make Uppercase: Converts all text to uppercase.
- Invert Sections on Desktop: Swap the content alignment for desktop view.
- Text Font Size (Desktop/Mobile): Adjust font size for desktop (12-20px) and mobile (12-20px).
- Auto Rotate: Automatically rotate between multiple announcements.
- Auto Rotate Speed: Set the speed for auto-rotation (3-10 seconds).
Menu and Color Settings
- Menu: Select a menu to display in the bar (link list for quick access).
- Color Scheme: Select a color scheme to match the bar with your store's branding.
Block Settings (Each Announcement)
- Icon: Choose an icon to accompany the announcement (e.g., truck, discount, return).
- Icon Position: Position the icon on the left or right side of the text.
- Text: Enter the announcement text.
