URL: /guides/authoring/announcement

---
title: "Announcement banner"
description: "Top-of-page strip for launches, deprecations, and notices."
icon: "megaphone"
---

# Announcement banner

The banner is a single horizontal strip rendered above the navbar on every page. Use it for product launches, deprecation warnings, planned-maintenance notices — anything that should be unmissable but dismissible.

## Configuration

Set `banner` in `docs.json`:

```json
{
  "banner": {
    "id": "v02-launch",
    "type": "info",
    "dismissible": true,
    "content": "Tangly v0.2 ships richer code blocks — <a href=\"/changelog\">see what's new</a>"
  }
}
```

`content` is HTML (a single anchor is the common pattern). `dismissible: true` adds a close button.

## Stable IDs

`id` is the localStorage dismissal key. When a reader dismisses the banner, the id is written to `localStorage` and the banner stays hidden on subsequent visits.

When you ship a new announcement, change the `id`. Old dismissals keyed on the old id are ignored, so every reader sees the new banner once.

If `id` is omitted, dismissal is session-scoped.

## Tone

`type` controls color. Pick the one that matches the message:

| `type`    | Use for                                  |
| --------- | ---------------------------------------- |
| `info`    | Launches, generic announcements (default).|
| `warning` | Deprecations, breaking changes, outages.  |
| `success` | Resolved incidents, milestone hits.       |

## Dismissed-then-re-shown

To force re-show without changing the id, ask the reader to clear the localStorage entry, or change the id. There's no admin-side "expire" — the banner stays up until you remove it from `docs.json` or the reader dismisses it.