Announcement bar

The Announcement Bar is a prominent section within your Shopify theme, strategically placed in the Header Group. It functions as a dynamic space allowing you to display crucial updates, promotions, or essential messages directly to visitors on your online store.

This feature provides a visually impactful way to communicate time-sensitive information and engage effectively with your audience.

How to set-up announcement bar?

  • Here, you have the flexibility to enable the sticky feature, making the Announcement Bar persistently visible as users scroll. Tailor the appearance further by selecting an appropriate layout by sidebar or scrolling text.

    Choose your preferred message navigation style whether it's a slider or Scrolling text– to enhance the visual appeal. Adjust the scroll speed to control the pace at which messages transition, creating a seamless and engaging experience for your visitors.


  • Language Selector

    • Show/Hide Language Selector: This option enables you to display or hide the language selector in the announcement bar.

      Country Selector

      Show/Hide Country Selector: This option lets you display or hide the country selector in the announcement bar.

      Show/Hide Country Flag and Country Name or Initials: When the country selector is enabled, you can choose to display either the full country name with its flag or just the country initials. This provides a clean and customizable look depending on your design preferences.

      Sublinks Settings

      Social Links

      • Show Social Links: Social media links will only appear if they are updated in the global theme settings. Ensure you have your social media URLs set in the global settings for platforms like Facebook, Twitter, Instagram, etc. This makes it easy for users to connect with your social media profiles directly from the announcement bar.

        Custom Links
      • Add Custom Links: You can add up to three custom links (Custom Link 1, Custom Link 2, Custom Link 3) in the announcement bar. Each link can be customized with the relevant information, such as the link text and URL, providing quick access to key pages or external sites
  • Personalize the Announcement Bar's aesthetics by defining a color scheme that complements your store's overall design. Explore dedicated theme settings for the Announcement Bar to ensure it seamlessly integrates with your chosen theme.
Enable Sticky Bar

Want your announcement to stay visible as customers scroll down your site?

Turn this on to make the bar "stick" to the top of the page—it’s perfect for can’t-miss messages like sales, shipping deals, or important notices.
Layout Width – Full or Fixed

Decide how wide your announcement bar should be:

Full Width:

  • Stretches the bar edge-to-edge across the screen.
  • Hides language selectors, region selectors, and sublinks to keep things clean.
  • You can use the Desktop Carousel Width slider to control how wide the content inside the bar appears (e.g., centered or stretched).

Fixed Width :

  • Keeps the bar aligned with your site’s main content area.
  • Allows space for language selectors, country selectors, and sublinks.
  • You can still use the Desktop Carousel Width slider, but the content won’t stretch to the full screen—it will adjust within the available space.
Desktop Carousel Width

Controls how wide your announcement content appears on desktop.

  • Measured in %, this slider lets you decide how much horizontal space the message should take.
  • Works best when using Full Width layout—set to 100% to stretch across or reduce for a more centered look.
  • In Fixed Width, this still works, but the content is limited to the container space (especially when using sublinks or language selectors).
Layout – Slider or Scrolling Text

Choose how your announcements display:

  • Slider: Shows one message at a time and switches between them like a slideshow.
  • Scrolling Text: All messages scroll from right to left in a ticker-style animation.
Scroll Speed (Scrolling Text only)

Controls how fast the text scrolls across the screen.

  • Set in seconds—the higher the number, the slower it scrolls.
  • Only applies if you’re using the Scrolling Text layout.
Carousel Animation (Slider only)

Enables smooth, automatic transitions between slides.

  • Turn this on if you want your slider messages to change automatically.
  • Works hand-in-hand with Change Slides Every.
  • If this is off, the first message will stay put unless the customer manually changes it.

⚠️ Want an auto-rotating slider? Make sure Slider layout + Carousel Animation are both on!
Change Slides Every (Slider only)

Controls how often the message changes in Slider layout.

  • Also set in seconds.
  • Shorter times = faster rotation, longer times = more reading time.
  • Only applies to Slider layout.

For users with advanced customization needs, the Announcement Bar offers options for custom CSS, providing a high level of control over the visual presentation.


Block Settings

To configure this section, navigate to the Header Group settings in your Shopify theme customization. Within the "Announcement Bar" section, find the "Announcement" block.

With these customization options, you can effortlessly set up the Announcement Bar to effectively convey important messages and updates, enhancing communication and engagement on your storefront.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us