Header, menus and footer

In the theme editor, the Header group holds the Announcement bar, Header, Menu drawer, Predictive search and Cart drawer sections. The Footer group holds the Footer and a Newsletter section. They show on every page.

Announcement bar

Short service messages across the top of every page. Add up to three Announcement blocks, each with an optional link.

• With Rotate announcements on, one message shows at a time and changes every few seconds (set the pace with Change every). Shoppers can pause it with the pause button, and on desktop step through with the previous and next arrows. Hovering over it or moving keyboard focus into it also pauses it.
• With it off, or for shoppers whose device asks for reduced motion, every message shows together.

Header

Layout

Desktop layout has four choices:

• Logo centered, menu left (default)
• Logo left, menu centered
• Logo left, menu beside it
• Logo centered, menu below

On phones and tablets, the header shows the menu button and search on the left, the logo in the middle, and the account and cart on the right.

Search, account and cart shows these as Icons (default) or Text on desktop. The country and currency selector always shows as text (for example "USD $"), so shoppers can see which currency is selected. On phones and tablets, the selectors are in the menu drawer instead.

Turn parts of the header on or off with Show search, Show country/region selector and Show language selector.

Menu and mega menus

Choose your menu under Menu (default: Main menu). A top-level item with child links opens a mega menu on desktop:

• Child links show in columns. Turn off Number the links to hide the small numbers.
• Show a collection image shows the image of the collection under the pointer or keyboard focus beside the links.
• Add Menu promo (image, label and link) or Menu featured product blocks to show tiles in a dropdown. Enter a top-level item's title in Show under menu item to choose its dropdown, or leave it empty to show the tile under every dropdown. Each dropdown shows up to two tiles, and the collection image counts as one.

Menus can have up to three levels.

Account

The account icon is Shopify's own account button. Signed-out shoppers get Shopify's sign-in panel; signed-in shoppers see the links from your Customer account menu. Nook styles it to match the header's colors and fonts. It only appears when customer accounts are turned on (Settings › Customer accounts).

Transparent header on the home page

With Show over the first section on the home page on, the header sits on top of the home page's first section and turns solid when the shopper scrolls, points at it or opens a menu. It only does this when the first section is a Hero video or Collection slideshow; with any other first section, the header stays solid. Choose Color scheme over the first section so the logo and links read clearly on your image. Midnight gives light text.

Sticky header

Sticky header has three choices: None, On scroll up (it hides as the shopper scrolls down and comes back when they scroll up) or Always.

Menu drawer (phones and tablets)

The menu drawer opens from the menu button. It shows the same menu as the header, with child links opening up to a third level. It also has a search link, the account button and the country and language selectors. Add up to two Featured tile blocks to show images with links at the bottom.

Footer

Build the columns with blocks: up to four Menu blocks, one Text block and one Email signup block.

• Menu: a heading and the top-level links of one of your menus.
• Text: a heading and text, for example your address or opening hours.
• Email signup: a newsletter field. New signups appear under Customers, subscribed to email marketing and tagged newsletter.

Below the columns:

• Show store name as wordmark: your logo text (or store name) set large, in the Wordmark size you choose: Display or Display small. It's always text, not your logo image.
• Show social media links: the links from Theme settings › Social media.
• Show Follow on Shop: lets shoppers follow your store in the Shop app. It needs Shop Pay turned on.
• Payment icons for the payment methods you accept, the country and language selectors, your policy links and the copyright line.

Country and language selectors

The selectors appear when your store sells to more than one country (Settings › Markets) or has more than one language (Settings › Languages). Turn each on or off in the header, footer and menu drawer.