# Header, menus and footer

Chapter 3 of the Wick user guide.

The announcement bar and header sit in the **Header** group at the top of the editor's section list; the footer is in the **Footer** group at the bottom. They show on every page.

## Announcement bar

A honey-colored strip above the header with three parts on wide screens: the **Left text** ("Hand-poured in small batches"), your messages in the middle, and up to two links on the right (**First link label** and **First link**, **Second link label** and **Second link**; a link needs both). Under 990px wide only the middle shows, and the links move to the bottom of the phone menu. Up to four blocks:

* **Announcement**: **Text** ("Free shipping over $60") and **Link**. Several announcements sit side by side, separated by small flames, while they fit. When the bar is too narrow for all of them (on phones, usually), only the first shows, so put your most important message first.
* **Countdown** (one per bar): a live countdown in small paper tiles. **Label** ("Last order for Christmas"), **End date** (format 2026-11-27), **End time** (24-hour, default 23:59), **Time zone** (Store time zone, or a UTC offset), **Link**, and **After the deadline**: Hide the countdown (default) or Show a message (**Message after the deadline**, "This sale has ended"). Shoppers get a pause button, and the deadline is also written out in words.

> **Note:** Use a real deadline that is the same for every shopper. Shopify doesn't allow fake countdowns, so don't extend or restart a deadline to create urgency.

## Header

The main row holds the search field on the left, your logo in the middle (the text logo has a small flame above the shop name and your italic line under it; set them in Theme settings › Brand), and the account key and the **Bag** with its count on the right. The navigation row below is centered, with a short accent bar under the current item.

| Setting | Default | What it does |
| --- | --- | --- |
| Menu | Main menu | The navigation row's menu |
| Menu style | Mega menu | **Mega menu** opens a top-level link's child links as a full-width panel, with room for a promo. **Dropdown** opens a short list under the link. |
| Open menus on hover | On | For shoppers using a mouse. Menus always open on click, tap and keyboard. |
| Scent menu | Empty | A menu shown as scent chips at the top of the phone menu. Each link's title is matched to a scent family for its dot, so title the links Woody, Floral and so on and point them at your scent filter or collections. |
| Show search | On | **Search placeholder**: "Search scents and candles" |
| Sticky header | On scroll up | **None**, **Always** (stays at the top of the screen, compacted to one row once shoppers scroll past it) or **On scroll up** (hides while shoppers scroll down and comes back when they scroll up) |

On phones, the main row becomes the menu key, the logo, and the search and bag keys; the menu, the account and localization links and the announcement links move into a menu drawer.

**Menu promo** blocks (up to six) add a promo card to the end of a mega menu panel: an image in a glow well with a small label over it holding a kicker, a heading, a line of text and "Shop now". Set **Menu item** to the title of the top-level link it belongs to, such as Candles, then **Image**, **Kicker** ("Scent of the month"), **Heading** ("Fig & Cedar"), **Text** ("A fig tree after a summer storm.") and **Link**. Each link shows up to two promos. In the theme editor, a promo whose menu item doesn't match a link with a panel shows a note saying so.

## Menus

Build menus in admin under **Content › Menus**. In the main menu, a top-level link with child links opens a mega menu panel:

* A link with one level of children (Candles › Jar candles, Travel tins, Wax melts…) becomes one column headed by its own title.
* A link with two levels becomes a column per child, each headed by the child's title, with the grandchildren under it.
* A child titled **Shop by scent**, or whose links point at the scent family filter (their address contains `scent_family`), shows its links as scent chips with family dots instead of a list. Title those links with the family names (Woody, Floral…) so each gets its color.

A top-level link without children is a plain link.

## Footer

The footer is a dark **dusk band** with a soft candle glow at the top. It holds these blocks, in any order:

* **Newsletter**: placed first, it becomes the wide sign-up row above the columns. **Kicker** ("The scent list"), **Heading** ("Be first to smell new scents"), **Text**, **Button label** ("Sign up"), **Customer tag** ("newsletter": added to everyone who signs up here, so you can find them in Shopify) and **Show Follow on Shop** (off).
* **Brand column**: your logo (set in Theme settings › Brand), **Text** and **Show social links** (on; add the links in Theme settings › Social media).
* **Menu column**: **Heading** ("Shop") and **Menu**. The presets have Shop and Help columns.
* **Text column**: **Heading** ("Visit the studio") and **Text**, for your address and opening hours.
* **Social media**: **Heading** ("Follow us") and the icons.

Footer settings: **Show country and language selectors** (on; set up markets and languages in Shopify admin), **Show policy links** (on) and **Show payment icons** (on).
