Header, navigation, and footer
Menus
Menus are created in Online Store > Navigation, not in the theme editor. Create your menu there first, then select it in the Header section.
Atelier supports three levels. A top level item with children becomes a dropdown; a second level item with children becomes a column of links inside it.
The header
Behavior
- Hide header when scrolling down. The header slides away as a visitor scrolls down and returns as soon as they scroll up.
- Show over the first section on the home page. The header sits over your hero with no background of its own, then takes on its color scheme once the visitor scrolls. Works best when the first section is a hero with a full-width image.
- Text color over the first section. Choose light for dark images, dark for light ones.
The logo stays optically centered no matter how long your menu is, because the three parts of the header sit in fixed tracks rather than floating next to each other.
Menu features
A Menu feature block adds an image and a link to one of your dropdowns.
- Add a Menu feature block to the Header section.
- In Menu item, type the top level menu item exactly as it appears in your menu, for example
Women. - Add an image, a kicker, a heading, and a link.
The same content also appears at the foot of that menu on a phone.
The announcement bar
Add one Message block per announcement. With more than one, they rotate; a visitor can pause the rotation, and it stops for anyone who asks their device to reduce motion.
Atelier will not display countdown timers, stock counts, or visitor counts. Shopify does not allow themes to invent urgency, and neither do we.
The footer
Add blocks for menus, text, a signup form, and social media icons.
- Wordmark. Your brand name set across the foot of the page at display size. Leave it empty to hide it.
- Country and language selectors appear only when your store actually sells in more than one country or language.
- Payment icons are drawn from the payment methods you have enabled.
Social media links are entered once, in Theme settings > Social media. An icon only appears for a field you have filled in.