# Header, menus and footer

Chapter 3 of the Derma user guide.

The header and footer are section groups: edit them from any page in the theme editor. The header group holds the **Announcement bar** and the **Header**; the footer group holds the **Footer**. You can add other sections to either group, such as Rich text or Icon row.

## Menus

Create menus in **Online Store › Navigation**. The presets use these handles:

| Menu handle | Used by | Exists on a new store? |
| --- | --- | --- |
| `main-menu` | Header › "Menu", the phone menu, and the footer's "Shop" column | Yes |
| `footer` | Footer "Help" column | Yes |
| `learn` | Footer "Learn" column (Derma, Daily) | No: create it, or choose another menu |
| `about` | Footer "About" column | No: create it, or choose another menu |
| `customer-account-main-menu` | Theme settings › Customer accounts | Yes, with customer accounts on |

A column whose menu doesn't exist shows nothing, so a fresh install may show fewer footer columns until you create `learn` and `about`.

## Announcement bar

Up to 4 blocks, shown one at a time.

* **Announcement**: "Text", "Link" and "Link label" (shown after the text, such as How we ship; on phones a long announcement links as a whole instead).
* **Countdown** (one per bar): "Label" (default "Sale ends in"), "End date" (format 2026-11-27), "End time" (24-hour, default 23:59), "Time zone" (default Store time zone, or a UTC offset), "Link", and "After the deadline": Hide the countdown or Show a message ("Message after the deadline", default "This sale has ended"). Use a real deadline that is the same for every shopper; Shopify doesn't allow fake countdowns, so don't extend or restart one to create urgency.

## Header

One calm row: menu on one side, your logo or wordmark, then the skin profile chip, search, account and bag.

| Setting | Default | Notes |
| --- | --- | --- |
| Menu | `main-menu` | |
| Menu style | Mega menu | Mega menu opens a top-level link's links in a full-width panel, as columns when they have links of their own. Dropdown keeps a small list. |
| Open menus on hover | On | For shoppers using a mouse. Menus always open on click, tap and keyboard. |
| Show collection images in menus | On | A small round collection image beside collection links in mega menus (mega menu only) |
| Logo position | Center | Center or Left |
| Show search | On | Opens predictive search |
| Show skin profile | On | Shows the shopper's saved skin profile (for example "oily, breakouts"). Needs "Remember skin profile" on in Theme settings › Skin and formula. On phones it shows as a bar under the header row. |
| Bag label | Bag | The word beside the count, such as Bag or Cart |
| Sticky header | On scroll up | None, Always, or On scroll up (hides while shoppers scroll down and returns when they scroll up) |

The account panel's links come from Theme settings › Customer accounts.

Header blocks:

* **Menu promo** (up to 6): an image tile inside a mega menu. "Menu item" is the title of a top-level link in the header menu, such as Shop all; the promo shows in that link's mega menu, with at most two promos per link. Settings: "Image", "Label" (default "New"), "Heading", "Text", "Link". In the editor, a promo whose menu item doesn't match a link with a mega menu shows a note saying so.
* **Free shipping note** (one): a full-width line above the header row with the free shipping amount from theme settings; "Label" defaults to "Free shipping over". Hidden until Theme settings › Commerce › "Free shipping over" is set.

## Footer

| Setting | Default | Notes |
| --- | --- | --- |
| Show large wordmark | On | The store name, very large, above the footer's last row, with a Back to top button |
| Wordmark text | | Leave empty to use the store name |
| Show country and language selectors | On | Set up markets and languages in Shopify admin |
| Show policy links | On | From Settings › Policies |
| Show payment icons | On | From Settings › Payments |

Footer blocks:

* **Newsletter**: "Heading" (default "Skin notes, once a month"), "Text", "Show Follow on Shop" (lets customers follow your store in the Shop app). Sign-ups become customers with email marketing consent in Shopify admin.
* **Text column**: "Heading", "Text" (rich text), "Show social links".
* **Menu column**: "Heading" (default "Shop"), "Menu" (default `footer`).
* **Social media**: "Heading" (default "Follow us"); icons for the links in Theme settings › Social media.
* Any theme block, such as Text or Button.