Header and navigation menu

The header is the navigation at the top of every page: your logo, the main navigation menu, and the search, account, and cart actions. In the theme editor it lives in the Header group, not on an individual page, so any change you make applies across the whole store.

Open the header settings

In the Shopify admin, go to Online Store then Themes.
On your theme, click Customize.
In the top section group list (left side), open the Header group and click Header.
The header settings open on the right.

The header cannot be added or removed like a page section. It is always present, and you can only have one. To control the message bar above it, edit the Top bar entry in the same Header group.

Logo

Your logo image, its sizes, and its inverted version are set under Theme settings in the Logo panel, not here. A link in this group points you there. The two settings below apply only when no logo image is set, so the store name shows as text.

Store name: overrides the text shown in place of a logo. Leave it blank to use your shop name.
Uppercase: shows the text store name in all capitals.

Layout

Desktop menu: chooses how the navigation appears on desktop.
- Full menu shows the menu items across the header.
- Hamburger hides the items behind a menu icon, the same icon used on mobile.
Open menu on: chooses whether a dropdown opens when a shopper hovers over a parent item (Hover) or clicks it (Click). This appears only when Desktop menu is set to Full menu.
Sticky header: controls whether the header stays on screen as a shopper scrolls.
- Always visible keeps it pinned to the top at all times.
- Show on scroll up hides it while scrolling down and brings it back when the shopper scrolls up.
- Never sticky lets it scroll away with the page.

Actions

These control the icons and button on the right side of the header.

Show search: shows or hides the search icon.
Show account: shows or hides the account icon. It appears only when customer accounts are turned on for your store.
Account menu: selects the navigation menu shown to a signed-in customer. This appears only when Show account is on.
Cart icon: the cart link is always shown and has no toggle. A count badge appears on it once the cart holds items. Whether clicking it opens a slide-in drawer or the full cart page is set by Cart type in Cart settings.
Button label: text for an optional call to action button in the header, for example a promotion or a sale link. Leave it blank to hide the button.
Button link: the destination for that button.

How the header sits over the page

The header is not a solid bar across the top. It floats near the top of the page as rounded translucent panels: one for the logo, one for the navigation, one for the actions. Its Color scheme sets the text, link, and button colors and tints those panels. There is no separate background color to set.

On most pages the theme reserves a strip of space above the first section so the panels do not cover your content. That strip is painted with the first section's own color scheme, so it reads as part of that section rather than as a band of its own.

Two things change that:

A section running under the header. The Hero slideshow has an Overlay this section with the header setting. With it on, and with the hero at the top of the page, the hero fills that space instead and the header floats over the image. The collection banner and the blog banner do the same on their own when they sit at the top of the page.
The dark header treatment. Open a section and turn on Use dark header theme over this section. While the header sits over that section its panels switch to a dark, frosted finish so light text stays readable over a photo or a dark scheme. The control appears on full-width sections that can sit behind the header, and is documented in Common section settings.

The dark finish does not come from a color scheme. It is one store-wide Surface color, set in Theme settings under Colors, so every dark header on the store matches. Changing it also tints the theme's other translucent surfaces.

Dropdowns and mega-menus

A parent item with child items in your navigation menu produces a dropdown automatically. The header can also hold richer mega-menu panels, built as blocks inside the Header section: see Mega menu. For most stores, building a well-structured menu in your store's navigation settings is all you need.

Below 950 pixels wide the desktop navigation and its panels give way to the hamburger menu, so dropdowns and mega menus are a desktop feature.

The Menu block

The theme also ships a Menu block you add elsewhere, most often in the footer or a group. It renders one navigation menu as a flat list and is separate from the header. In Add block it appears under Links. Its settings are documented in Footer.

The Logo block

A Logo block places your store logo anywhere on the page, most often in the footer. The logo image itself comes from Theme settings under Logo. In Add block it appears under Basic.

Use inverted logo: shows the inverted logo version where it reads better against a dark surface. This appears only when both a logo and an inverted logo are set in theme settings.
Link: where the logo links to. It defaults to the home page.
Alignment: Left, Center, or Right.
Desktop width: from 40 to 400 pixels, default 160.
Mobile width: from 40 to 300 pixels, default 120.

The Logo block also uses the standard Margin control. See Common section settings.

The Header section itself uses the standard Color scheme control. See Common section settings.

Tips

The header's links come from the navigation menu you pick in Menu, not from blocks. To change what appears in the bar, edit that menu under Online Store then Navigation.
If the account icon is missing even with Show account on, confirm customer accounts are enabled in your Shopify settings.
If you choose Show on scroll up or Never sticky, test a long page on a phone so the header behaves the way you expect while scrolling.