# Announcement bar

[![Light yellow announcement bar with the message COOL NEW COLOR: STERLING SO WORTH IT and a close button, above the Minimog header and a New Arrivals slideshow](https://docs-assets.foxecom.app/minimog-theme/87493bf2-16b8-4f66-8095-d5b0b6f68a8d.png)](<Light yellow announcement bar with the message COOL NEW COLOR: STERLING SO WORTH IT and a close button, above the Minimog header and a New Arrivals slideshow>)

Tell every visitor about free shipping, new stock, or a sale before they start browsing. The **Announcement bar** shows a short message at the very top of your store, above the header. Add more than one message to turn it into a slider.

<Embed url="https://youtu.be/J4gTGCeDaVA" />

<Hint type="info">
  These settings apply to Minimog 5.0.0 and above.
</Hint>

## How to add Announcement bar

1. Open the theme editor (**Edit theme**).
2. Click **Add section** under **Header** in the sidebar.
3. Select **Announcement bar**.
4. Click **Add Announcement item** under **Announcement bar**.
5. Enter your text in **Message**.
6. Click **Save**.

If **Announcement bar** is already in the **Header** group, click it to edit it instead.

## Section settings

### General

These settings set where the bar shows, how wide it is, and whether customers can close it.

<Table widths="30%">
  | Setting               | Description                                                                                                                         | Options                                                      |
  | --------------------- | ----------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------ |
  | **Container type**    | The width of the bar's content. See [Layout settings](https://docs.foxecom.com/minimog-theme/theme-settings/layout-settings) for the widths each option uses. | **Default**, **Full width**, or **Use container box**.       |
  | **Color scheme**      | The background and text colors of the bar.                                                                                          | Select a scheme. Click **Edit scheme** to change its colors. |
  | **Show announcement** | Shows or hides the bar.                                                                                                             | **On** or **Off**.                                           |
  | **Home page only**    | Where the bar appears.                                                                                                              | **On**: the home page only.<br /><br />**Off**: every page.  |
  | **Show close button** | Adds a close button on the right so customers can dismiss the bar.                                                                  | **On** or **Off**.                                           |
  | **Show divider**      | Adds a thin line between the bar and the header.                                                                                    | **On** or **Off**.                                           |
</Table>

![General settings with Container type set to Use container box, a light yellow color scheme, and Show announcement, Home page only, Show close button, and Show divider turned on, next to the yellow announcement bar](https://docs-assets.foxecom.app/minimog-theme/37500012-5db2-4686-9ac1-a574880f3103.png)

### Slider settings

These settings only work when you have 2 or more announcement items.

<Table widths="30%">
  | Setting                 | Description                                            | Options                                                                 |
  | ----------------------- | ------------------------------------------------------ | ----------------------------------------------------------------------- |
  | **Show navigation**     | Shows arrows so customers can move between messages.   | **On** or **Off**.                                                      |
  | **Auto-rotate slides**  | Switches between messages automatically.               | **On** or **Off**.                                                      |
  | **Change slides every** | How long each message stays before the next one shows. | 2 to 10 seconds. <br /><br />*Works when **Auto-rotate slides** is on.* |
</Table>

![Slider settings with Show navigation and Auto-rotate slides turned on and Change slides every set to 3 s, next to the announcement bar with previous and next arrows on each side](https://docs-assets.foxecom.app/minimog-theme/0cb532a0-82f0-4f13-8d89-12d5a0ca3828.png)

## Block settings

### Announcement item

Each **Announcement item** is one message in the bar. To add another, click **Add Announcement item** under **Announcement bar** in the sidebar.

<Table widths="30%">
  | Setting     | Description                                           | Options                                                                  |
  | ----------- | ----------------------------------------------------- | ------------------------------------------------------------------------ |
  | **Message** | The text shown in the bar.                            | Enter text, such as `Free shipping for all orders from $60+`.            |
  | **Link**    | The page customers go to when they click the message. | Paste a link or search for a page.<br /><br />*Leave blank for no link.* |
</Table>

![Announcement item block selected under Announcement bar, with the message COOL NEW COLOR: STERLING ☁️ SO WORTH IT shown in the light yellow bar at the top of the store](https://docs-assets.foxecom.app/minimog-theme/a0dd8572-7006-4ce2-893f-18b9b1c151b5.png)

<Hint type="success" title="Done when: ">
  Your message shows in the bar at the top of the theme editor preview.
</Hint>

## Tips and best practices

* To hide the bar for a while, turn off **Show announcement** instead of removing your announcement items.
* For contact details, social links, and currency or language selectors above the header, use the [**Top Bar**](https://docs.foxecom.com/minimog-theme/pages-global-sections/header#top-bar) block in **Header**.

## Related articles

<PageLink href="https://docs.foxecom.com/minimog-theme/pages-global-sections/header" subtitle="Set up your logo, menus, mega menus, and top bar">Header</PageLink>