Header

The header holds your logo, the main menu, search, the customer account button and the cart. It sits in the header area of the theme editor, so it appears on every page. Your logo and its width are set in Theme settings → Logo and favicon.

On desktops, the menu shows in the header, with the logo on the left or in the center. On phones and tablets, it moves into a menu drawer that opens from the left.

Mega menus#

A top-level menu item opens a wide mega menu instead of a small dropdown when either of these is true:

• It has three levels of links: the item, its children and at least one grandchild. Children with grandchildren become column headings.
• You add a Menu images block and type the item's title in Menu item, exactly as it's written in your menu, including capital letters.

A Menu images block adds up to two images with titles and links to that mega menu. The first Menu images block also shows its images at the bottom of the mobile menu drawer.

Best practices#

• Keep the top level short. Five to seven top-level items fit on one line at most screen sizes. Put the rest one level down.
• Choose a menu style that fits your brand. Menu style → Pill groups the top-level links in a soft, rounded tray. Text keeps them as plain links.
• Keep the header visible on long pages. Keep header visible while scrolling helps shoppers reach search and the cart from anywhere. Turn it off for very tall logos.
• Account menu. The account button only appears when customer accounts are turned on in Shopify admin. Account menu sets the links shown in its account sheet.
• Country and language. The selectors only make sense once you sell in more than one country or language. Add them in your market settings first.

See Navigation and mega menu for building the menu itself.

Preset tips#

• Vellora centers the logo with plain text links, which suits a calm, editorial store.
• Sorrel puts the logo on the left and uses the pill menu style.
• Graphite puts the logo on the left with plain text links, which leaves room for a long menu.

Handle

header

Group

Header, footer and pop-ups

Where

Added to the header area of the theme editor.

Settings#

Customer accounts#

Country and language#

To add a country or language, go to your market settings (Shopify admin > Settings > Markets).

Blocks#

Add blocks to this section from the theme editor, then drag them to change their order.

Menu images#