Header & navigation
The header is managed as a section group in sections/header-group.json.
Header components
| Component | Section file | Purpose |
|---|---|---|
| Announcement bar | announcement-bar.liquid | Top promo strip with optional countdown |
| Main header | header.liquid or header-layout2.liquid | Logo, menu, search, cart, account |
| Vertical header | header-vertical.liquid | Side navigation layout |
| Mega store header | header-mega-store.liquid | Large catalog mega menu |
| Top bar | top-bar.liquid | Secondary info bar |
| Breadcrumb | breadcrumb.liquid | Page breadcrumbs |
Default setup (Novara preset)
The preset uses:
- Announcement bar — marquee text with optional sign-up link
- Header layout 2 — centered logo, mega menu with promotions
Configure main menu
- Shopify Admin → Content → Menus → create/edit main menu
- Theme editor → Header → select header section
- Choose menu in Navigation / menu setting
Mega menu promotions
In header-layout2, add Menu promotion blocks:
- Match block Menu item title to a top-level menu link text
- Upload promotion images, set column width, full-width submenu
Header styles
| Setting | Location |
|---|---|
| Sticky header | Header section settings |
| Transparent header | Header section → enable on homepage |
| Logo on transparent | Theme settings → Logo → logo on transparent |
| Search style | Header section → search type |
| Cart icon / count | Theme settings → Cart |
Header layouts comparison
- header — Standard horizontal header
- header-layout2 — Alternative layout with mega promotions (default in preset)
- header-vertical — Vertical sidebar navigation
- header-mega-store — Extra-large mega menu for big catalogs
Full settings: Header section | Header layout 2