# Announcement bar

An announcement bar is a sleek, attention-grabbing feature on your website designed to showcase key messages for your visitors. It's an easy and impactful tool to draw focus, promote exclusive offers, or communicate timely updates to your audience as they navigate your site.

{% hint style="success" %}
**Steps:**

1. In the theme editor **(Customize)**, click **Add section**
2. Locate **Announcement bar**
3. Make necessary changes **> Save.**
   {% endhint %}

### Settings

<figure><img src="https://2841038207-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGTidUfSjAqopf8pRRmN%2Fuploads%2Fr8GmqHuHUD9UXZ4kjzM2%2F2025-04-03_23-16-57.jpg?alt=media&#x26;token=796334af-a8ae-408c-b536-283b68ecf624" alt=""><figcaption></figcaption></figure>

* **Announcement width** - 5 options for container
* **Announcement height** - 3 options for height
* **Show border -** Show border bottom of this section

#### Carousel settings

* **Show arrows**&#x20;
* **Auto-rotate announcements** - Auto-rotate announcements in the announcement bar.
* **Autoplay speed** - Set the speed of the auto-rotate announcements.
* **Animation type** - Set the animation type of the announcements

#### Colors

* **Background** - Background color
* **Text** - Text color

### Announcement Block

<figure><img src="https://2841038207-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGTidUfSjAqopf8pRRmN%2Fuploads%2FdZnATv6G7cW7ENxiIx4j%2F2025-04-03_23-18-38.jpg?alt=media&#x26;token=01b4670f-bffc-4c0d-a697-12fbad75e9e2" alt=""><figcaption></figcaption></figure>

* Text&#x20;
* Icon
* Link
* Countdown - Date format: YYYY/MM/DD HH:MM:SS -> Example: 2025/12/31 23:59:59
