> For the complete documentation index, see [llms.txt](https://aries-theme.gitbook.io/docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://aries-theme.gitbook.io/docs/group-sections/header-group/announcement-bar.md). # Announcement bar The Announcement bar is a versatile section that appears at the very top of your store, right above the header. It's perfect for displaying important messages, promotions, shipping information, or special announcements to your customers. You can create multiple announcements that automatically rotate, or use a countdown timer to create urgency for limited-time offers. The announcement bar helps you communicate key information immediately when visitors land on your site.
{% hint style="info" %} ### How to set it up 1. Go to **Online Store** > **Themes** > **Customize**. 2. Open **Sections** > **Announcement bar**. 3. Make your changes, preview live, then click **Save**. {% endhint %} ### Settings #### Layout * **Color scheme**: Choose the color palette for the announcement bar background and text. This helps match your brand or create visual contrast with the header below. * **Separator line**: Adds a subtle line below the announcement bar to visually separate it from the header section. * **Full width**: When enabled, the announcement bar stretches across the entire screen width. When disabled, it respects your theme's page width settings. #### Text * **Font type**: Choose between "Heading" or "Body" font styles for your announcement text. This lets you match the announcement style to your brand typography. * **Size**: Select the text size for your announcements. Options range from H6 (smallest) to H3 (largest), allowing you to control how prominent your message appears. * **Letter spacing**: Adjust the spacing between letters in your announcement text. This can help improve readability or create a more stylized look. * **Text transform**: Control how your text appears: "Uppercase" makes all letters capital, "Capitalize" capitalizes the first letter of each word, or "None" keeps your text as typed. * **Text hover effect**: When enabled, an underline animation appears when customers hover over clickable announcement text, providing visual feedback. * **Underline thickness**: Control the thickness of the underline that appears on hover (if hover effect is enabled). Adjust from 1px to 5px to match your design preferences. #### Slideshow * **Autoplay**: When enabled, multiple announcements automatically rotate at the interval you set. This is useful for displaying several messages without manual navigation. * **Change every**: Set how many seconds each announcement displays before automatically switching to the next one. This only applies when Autoplay is enabled. * **Show controls**: Display navigation arrows (previous/next buttons) that let customers manually browse through multiple announcements. #### Utilities * **Social media icons**: Display your social media icons in the announcement bar. These only appear on large screens and link to the social accounts you've configured in your theme settings. * **Country/region selector**: Show a dropdown menu that lets customers select their country or region. This is useful for international stores and only appears on large screens. * **Language selector**: Display a language selector dropdown for stores with multiple languages enabled. This only appears on large screens. *** ### Blocks #### Announcement * **Text**: Enter the message you want to display in the announcement bar. Keep it short and clear for best results. * **Link**: Add an optional link that makes the entire announcement clickable. This is great for directing customers to sale pages, shipping policies, or important information. #### Countdown * **Text**: Enter the message that appears before the countdown timer. This can describe your limited-time offer or event. * **End date**: Set the date when the countdown should end. Format: YYYY-MM-DD (e.g., 2026-12-01). * **End time**: Set the exact time when the countdown should end. Format: HH:MM:SS in 24-hour format (e.g., 12:00:00). * **Text to show when countdown ends**: Enter the message that replaces the countdown timer once it reaches zero. This lets you communicate that the offer has ended or provide next steps. * **Color scheme**: Choose a color palette specifically for the countdown timer display, which can differ from the main announcement bar colors. *** ### Tips * Keep your announcements concise and action-oriented. * Since this appears at the very top of every page, use it for your most important messages like free shipping thresholds, new arrivals, or flash sales. * If you're using multiple announcements, make sure each one serves a distinct purpose to avoid overwhelming customers. * The countdown timer works best for creating urgency around sales or events, but remember to update the end date and time regularly.