Header
Set up the Avante desktop header: logo, main menu, mega menu dropdowns, search, account and cart icons, sticky and transparent modes.
The main desktop navigation bar displayed at the top of every page. Includes your store logo, primary menu, mega menu dropdowns, search, account and cart icons, with support for sticky and transparent modes.
How to find
Theme Editor → Header group → Header
The Header section controls only the desktop navigation bar. Mobile navigation is handled by the separate Mobile Header section.
Logo
Logo image
Your store logo. If not set, the store name displays as text
Transparent logo
Alternative logo for transparent header mode — typically a white or light version for dark hero backgrounds
Logo height
Logo size in pixels. Applies to both desktop and mobile
Tip: Upload your logo as a PNG with a transparent background. This ensures it works cleanly on both default and transparent header states.
Miscellaneous
To create or edit menus, go to Shopify Admin → Content → Menus.
The Miscellaneous block controls what appears in the header bar — menu links, search, cart, account, and other elements. Most settings are self-explanatory, but a few features are easy to miss:
Highlight menu items — draw attention to specific links like "Sale" or "New In". Enter the menu item names (comma-separated) in the Highlight menu item field and pick a color. The matching links will stand out from the rest of the navigation.
Search as a field — instead of a small icon, you can display a full inline search bar directly in the header. Set Search → Style to Field.
Store selector — if you run multiple regional stores, enable the store selector to let visitors switch between them. The selector content is configured in the Store selector drawer section in More header sections.
News icon — shows a bell or fire icon that opens the News Drawer. The drawer itself is configured separately in More header sections.
Mega menu & Hover mega menu
The Header supports two advanced navigation blocks — Mega menu (multi-column layout with optional banner) and Hover mega menu (links with up to two banners and per-item visuals). Both are added via Add block inside the Header section.
For setup instructions, settings, and troubleshooting, see the dedicated guide: Mega menu & Hover mega menu.
Sticky header
When enabled, the header stays fixed at the top of the screen as the visitor scrolls down. This keeps navigation accessible without scrolling back up.
Sticky header
Enable or disable the sticky behavior
Tip: Sticky headers work best when the header is compact. A tall header with a large logo takes up too much screen space when pinned.
Related
Mobile Header — mobile-specific navigation
Menu Drawer — slide-out navigation panel
Appearance settings — navigation layout, sidebar mode, and transparent header
Transparent header — full setup guide
Last updated
Was this helpful?