Header

Logo

Logo image

ImageIf empty, the store name is shown as text.

Logo width on desktop

Slider, 100 to 300 pxDefault: 190 pxWidth of the visible part of the logo, after the transparent margins are trimmed.

Logo maximum height on desktop

Slider, 40 to 160 pxDefault: 65 pxA tall logo is scaled down to this height. The height is that of the visible part.

Logo width on phones

Slider, 80 to 200 pxDefault: 100 pxWidth of the visible part of the logo on phones and tablets. On narrow phones it shrinks when needed, so the icons beside it keep their room.

Logo maximum height on phones

Slider, 24 to 44 pxDefault: 34 pxA tall logo is scaled down to this height on phones and tablets. The bar is a fixed 48px high, so up to 44.

Logo position in the notch on phone

Slider, -8 to 12 pxDefault: 4 pxA positive number moves the logo down, a negative one moves it up. 0: centered in the header row.

Logo position in the notch on desktop

Slider, -8 to 12 pxDefault: 0 pxA positive number moves the logo down, a negative one moves it up. 0: centered in the header row.

Trim transparent margins from the logo

Trim from the top

Slider, 0 to 40 %Default: 17 %

Trim from the bottom

Slider, 0 to 40 %Default: 22 %

Trim from the left

Slider, 0 to 40 %Default: 7.5 %

Trim from the right

Slider, 0 to 40 %Default: 3.5 %

A logo image usually has transparent margins around the signature. Set how much is cut from each side of the image (in percent); the logo sizes above then refer to what is left. For an image that is already cropped tight, keep every value at 0.

Icons

Show the search button

On or offDefault: On

Words typed in the search field

TextOn phones, when search opens, these words are typed into the field one after another. Separate with commas. Leave empty to use the main menu link names. They also appear as ideas before typing.

Before typing

Choice: Ideas and recent searches, Ideas only, Recent searches only, NothingDefault: Ideas and recent searchesIdeas are the search field words. Recent searches are each customer’s own, saved in their browser.

Account menu

MenuLinks in Shopify's account window, under sign-in. "Customer account main menu" keeps them the same as in the account pages.

Header coin size

Slider, 36 to 48 pxDefault: 40 pxDiameter of the header coins on phones and tablets. On computers the header has no coins: the icons sit on the strip as lines. The icon inside a coin is half the diameter.

Bag reacts to adding

On or offDefault: OnWhen a product is added to the cart, the bag drops slightly, squashes and bounces back. Not when a quantity changes inside the cart.

Computer header

Desktop menu style

Choice: Library: all links in columns, Rooms: one group at a time, Gallery: an image for each groupDefault: Library: all links in columnsHow the panel under the strip shows a menu item’s links. Built from your regular menu, up to three levels.

Collection image in menus

On or offDefault: OnIn the library and rooms styles, the collection image appears next to the links and changes with the link under the pointer. The gallery always shows images.

Menu panel color

Choice: White, like search, Dark, Custom colorDefault: White, like search

Panel color

ColorThe text color is chosen automatically: dark on a light color, light on a dark one.

Floating menu on phones

Floating menu when scrolling

Choice: Off, On phonesDefault: On phonesOn phones, when the header scrolls away, the same four icons float in a pill at the bottom of the screen, near the thumb. The menu, search and cart open from the top, like at the top of the page. Chat apps: leave a bottom margin of at least 90px in their settings so they sit above it.

Floating menu shape

Choice: Tab from the frame, Floating, narrow at the top, Floating, wide at the topDefault: Tab from the frameTab: rises from the bottom of the frame in the shape of the logo notch, in the frame color. The floating shapes use the menu color below.

Floating menu color

Choice: Like the header coins, Dark, LightDefault: Like the header coins"Like the header coins" follows the header coin color: dark with a dark frame, light with a white frame.

Bottom menu icon color

ColorThe icons in the floating menu on phones. Blank: the color of the menu tone.

Bottom menu ring color

ColorThe thin ring around each icon, with no fill. An open icon fills with this color. Blank: the color of the menu tone.

Distance from the frame

Slider, 0 to 24 pxDefault: 4 pxThe space between the menu and the frame below it, or the browser bar when it covers the frame. The same when scrolling up or down. Default: 4px.

Menu

Main menu

MenuEdit the menu items under Content > Menus.

Small heading above the phone menu

TextLeave empty to use the default.

Members' club button text

TextThe button at the bottom of the phone menu. Leave empty to use the default.

Language and country selector in the menu

On or offDefault: OnAbove the club button. Appears only when there is more than one language or country.

Language selector in the strip

On or offDefault: OnOn computers, a language selector in the top strip, before the search icon. On phones and tablets it is in the menu.

Flags next to the languages

On or offDefault: OnA small flag beside each language. Some stores prefer none, because a language is not a country.

Social networks in the menu

On or offDefault: OnA row of solid icons below the club button, as in the footer. Links and order are set in Theme settings, under Social media. Facebook, Instagram, TikTok, YouTube and X show as a plain icon until you add a link; other networks only with a link.

Menu color

ColorDefault: #FFFFFFAny color you like. Text and the button adapt: on a dark color the text is cream. Default: white, like the frame.

Background style

Choice: Flat color, Lit stageDefault: Flat colorLit stage: a soft light from above that fades toward the bottom, made from the chosen color. On a light color the top turns white; on a dark color it becomes a dark stage.

Light color

ColorThe soft light from the top center. Empty: white.

Club button color

ColorThe button at the bottom of the menu. Empty: the menu color. The text turns light or dark to match.

Menu background image

ImageOptional. The image loads only when the menu is first opened. A veil in the menu color sits above it.

Veil strength over the image

Slider, 0 to 100 %Default: 80 %How much of the menu color covers the image so the text stays readable. 0 shows the image as is.