The header is a sticky section displayed at the top of every page. It contains the store logo, a prominent search bar, cart and account icons, and a full-width navigation bar underneath.
To change the logo, go to Theme settings > Logo and favicon in the Theme Editor. You can upload separate logos for desktop and mobile, and control the logo height for each.
The navigation bar appears directly below the main header bar on desktop. It displays the items from your menus and supports mega menus for top-level items. On mobile, it is replaced by a hamburger menu.
See Navigation for details on menus, dropdowns, and the action button, and Mega menus for setting up rich, full-width dropdown menus.
The header includes a dropdown search panel with predictive results, recently viewed products, and popular search suggestions. Search settings — including popular products, placeholder content, and trending searches — are configured within the header section in the Theme Editor.
See Search for details on configuring the search experience.
The Mobile layout setting controls the position of the logo on small screens:
The following settings control additional elements displayed at the bottom of the mobile menu drawer:
The header offers granular color control across its different areas: