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.