The Announcement Bar

3 min readUpdated October 31, 2026

The announcement bar is a one-line message at the top of every account page, for signed-in customers. Use it for a sale, a shipping delay, new opening hours or a link to something new, without editing any page.

Turn it on#

Go to WooCommerce > Account Portal > Content & Text.
Type your message in Announcement.
Optionally fill in Link (optional), choose a Colour and set whether customers can close it.
Click Save Settings.

To turn the bar off, empty the Announcement field and save.

Settings#

Setting	What it does	Default
Announcement	The message. One line of plain text; `{{first_name}}`, `{{last_name}}` and `{{display_name}}` work. Empty means no bar.	Empty
Link (optional)	Makes the whole message a link, with an arrow after it.	Empty
Colour	Brand colour, Calm (soft brand tint), Green or Amber.	Brand colour
Customers can close it (it comes back when you change the text)	Adds a close button.	On

Colours#

Brand colour: your primary colour with contrasting text. Stands out most.
Calm (soft brand tint): the soft tint used for the active menu item, with normal text. Good for everyday notices.
Green: a light green tint, for good news (a new feature, a delivery that is back on track).
Amber: a light amber tint, for warnings (delays, maintenance).

All four follow light and dark mode. The tints are mixed with the page background, so they stay readable in both.

Announcement settings with message, link field, Colour menu open on four options and the close checkbox

Closing the bar#

When Customers can close it is on, a customer who clicks the close button does not see the bar again in that browser. The choice is remembered in the browser (no account data is stored), so the bar comes back:

when you change the text or the link,
on another device or browser, or after the customer clears their site data.

A closed bar stays hidden from the first moment the page loads, without flashing.

Tip

To show an old message again to everyone who closed it, change it slightly (or change the link).

Who sees it, and where#

Only signed-in customers, on all account pages (Dashboard, orders, custom pages and so on). It is not shown on the sign-in or registration page.
It sits at the top of the content area, above the Dashboard widgets and page content, in every menu style.
It is not shown in the header drawer of the Account Nav Widget or elsewhere on your site.

Translations#

On a multilingual site, translate the message on the same tab: pick the language at the top and fill in Announcement. Leave it empty to show the original text in that language. The text is also registered with WPML String Translation when you save.

Note

The bar is switched on by the text in your main language. A translation alone does not show a bar; and while the main text is filled in, every language shows the bar (in its translation, or the original). The link and colour are the same in every language.

Each language’s text counts as its own message for closing: a customer who closed the English bar still sees the French one.

For developers#

The bar has the classes wap-announce and wap-announce--brand, --info, --success or --warning. To use your own colours, set the custom properties in WooCommerce > Account Portal > Appearance > Advanced CSS:

.wap-announce {
	--wap-announce-bg: #111827;
	--wap-announce-fg: #ffffff;
}

These two properties change the Brand colour style; the other styles set their own background.