Start a project

Getting started

From installing the theme to publishing your store, in the order that saves the most rework.

This page takes you from installing Masthead to publishing it. The steps are in the order that saves the most rework: brand settings first, then navigation, then the pages themselves. You can stop after any step and come back; nothing is live until you publish.

1. Install the theme

  1. Open Masthead in the Shopify Theme Store and choose the preset you want to start from.
  2. Click Try theme. Masthead is added to the draft themes in your store. You can set up and preview the whole theme before you pay; you pay once, when you publish.
  3. In your Shopify admin, go to Online Store. Find Masthead under your draft themes and click Edit theme to open the theme editor.

Your current theme stays live and untouched while you work on Masthead. Customers see nothing until you publish.

2. Choose a preset

Masthead comes with three presets. Each one sets the colors, typefaces and shapes, and installs its own home page, header and footer. Pick the one closest to your brand; you can change everything afterwards.

Masthead Warm paper tones, a light serif and square corners. The default. Broadsheet Black, white and red with condensed uppercase headlines. Almanac Soft earth tones, rounded corners and pill buttons.

See Presets for what each preset installs, and how to switch to another one later.

3. Set your brand in theme settings

Theme settings apply to the whole store, so set them before you build pages. In the theme editor, click the Theme settings icon. The groups that matter most at the start:

  • Logo: upload your logo and set its width. Add a favicon while you are there.
  • Colors: edit the five color schemes to your palette. Sections pick a scheme, so a change here reaches every section that uses it.
  • Typography: choose the heading, body and accent fonts, and scale them up or down.
  • Layout: set the page width and spacing, and decide whether sections are numbered with Number sections.
  • Buttons and corners: square, rounded or pill buttons, and the corner radius of inputs and images.
  • Product cards: the image ratio, hover image, swatches, quick add and badges used on every product grid.
  • Cart: a cart drawer or a cart page, and whether customers can leave an order note.

Every setting in every group is explained in Theme settings.

Menus are created in your Shopify admin under Content > Menus, then chosen in the theme. Masthead starts with Shopify's two default menus: the header uses your main menu, and the footer shows the main menu and the footer menu in two columns.

  1. Edit your main menu. Top-level items appear in the header; items nested under them open as a dropdown.
  2. In the theme editor, select the Header section and check its Menu setting.
  3. Choose the header's Desktop layout and Sticky header behavior.
  4. Select the Footer section and point each Menu block at the menu it should show.

The header and footer are shared by every page, so you set them up once. Header and Footer cover the mega menu, the transparent header, the announcement bar and the country and language selectors.

5. Build your home page

Your preset has already placed sections on the home page, filled with placeholder content. In the theme editor:

  1. Click a section in the left sidebar to open its settings, and replace the placeholder images and text with your own.
  2. Drag sections to reorder them. Hide a section with its eye icon, or remove it from its settings panel.
  3. Click Add section to add more. Masthead's signature sections, such as Cover hero, Scrolling lookbook story and Editorial product spread, are in the same list as the standard ones.

Set a focal point on your images. Open an image in Content > Files in your Shopify admin and mark the part that must stay in view. Masthead crops around it on every screen size.

6. Check your product and collection pages

Use the page selector at the top of the theme editor to open Products > Default product and Collections > Default collection. Both templates work as installed, but a few things are worth setting up for a fashion store:

  • Color swatches. Swatches come from your product options in Shopify, not from the theme. Product pages explains how to add them.
  • Size chart. The product page has a Size chart block that opens a page of yours in a drawer.
  • Complete the look. The Complete the look section sells an outfit together, and can show a different look on every product.
  • Filters. Collection and search filters are managed in Shopify's Search & Discovery app. Collection and search covers the setup.

7. Preview and publish

  1. In the theme editor, use the device buttons at the top to check the store on mobile as well as desktop.
  2. Click Save, then preview the theme and browse the store as a customer would. Add a product to the cart and go through to checkout.
  3. When you are happy, go to Online Store and click Publish for Masthead. If you have been trying the theme, you are asked to buy it at this point.

Your previous theme moves to your draft themes, with all its settings, so you can go back to it at any time.

Where to go next