Getting started
Setup guide
The steps in the right order, from first opening the editor to going live.
On this page
This guide follows the order that saves the most time: global settings first, because every section depends on them, then the frame (header and footer), then the pages. Allow one to two hours for a complete first setup.
1. Prepare your content in the admin
The theme displays your Shopify data, so it's best to have it in place before you build your pages.
- Products with their photographs, variants, and descriptions. For color swatches, fill in your color options with their swatches.
- Collections, with an image for any that will appear in lists or in the mega menu.
- Menus in Online StoreNavigation: the main menu (
main-menu), the footer menu (footer) and, if needed, a legal menu. See Menus and mega menu. - Pages (About, Contact…) in Online StorePages, and a blog if you plan to use the Journal section.
- Policies (refund, privacy, terms) in SettingsPolicies.
- Filters in the Search & Discovery app if your collections should be filterable. See Collection filters.
2. Choose a style
Open the editor, then Theme settings (the gear icon). If you haven't chosen a style yet, do it now: it sets fonts, letter case, control shape, and other axes in one go. See Theme styles.
3. Adjust the theme settings
In Theme settings, in this order:
Colors
Adjust the three bundled color schemes or create more. Each section then picks a scheme. See Colors.
Typography
Heading font, body font, letter case, and reading size. See Typography.
Layout
Page width and margin, density, grid gutter. See Layout.
Buttons and fields
Control size and shape, field style, and product option style. See Buttons and fields.
Social media and favicon
Add links to your accounts and the browser tab icon. See Social media and favicon.
4. Build the header and footer
They appear on every page, so you only set them up once.
- Announcement bar: replace the sample messages, or remove the section if you don't need it.
- Header: logo, logo position, menu, sticky or transparent header.
- Footer: link columns, an about text with social links, newsletter signup, legal menu.
5. Build the home page
The bundled home page strings together nine sample sections: hero, featured collection, featured product, statement, image with text, collection list, journal, services, and newsletter. For each one:
- choose the resource (collection, product, blog) and add your images;
- replace the sample text;
- remove or hide the ones you don't need.
6. Set up the page templates
In the page selector at the top of the editor, open each template:
- Products: the block order and the three sample collapsible rows, whose text appears on all your products until you change it.
- Collections: collection header, columns, filters, pagination, and product cards.
- Collections list, Search, Cart, Blog, Pages, Contact, 404, and Password.
7. Check the theme text
Some text isn't a setting but part of the theme's translations: the cart's service promises ("Secure payment", "Complimentary delivery", "Free exchanges and returns", "Collect in store"), the tax note under the price, and so on. Make sure they match what you actually offer. See Edit the theme text.
Before you go live
- Your logo and favicon are in place.
- No placeholder illustrations or sample text remain on the home page.
- The collapsible rows on the product page describe your products (or are removed).
- The cart's service promises are accurate, or hidden.
- Header and footer menus link to the right pages.
- A filtered collection, a search, and an add to cart all work.
- You've checked the store on a phone.
- Important images have alt text (ContentFiles or the product page in your admin).
- Sharing on social media shows an image: Online StorePreferencesSocial sharing image.
Maison 1.0.0