Getting started

This guide takes you from a fresh install to a published store: the theme editor, your brand settings, the header and footer, the home page, and the cart.

Open the theme editor

From your Shopify admin, go to Online Store.
Next to Inkblot, click Edit theme. If Inkblot isn't your current theme yet, find it in your theme library and click Edit theme there; you can set everything up before anyone sees it.
The editor opens on the home page. The drop-down menu at the top switches between templates, such as the product or collection page. The sidebar lists the sections on the current template; click one to change its settings, or add, hide and reorder sections and blocks.

Colors, fonts and motion

Open Theme settings in the theme editor. Every setting is listed in the Theme settings reference.

Colors: the page background, text, secondary text and border colors, and the colors for errors.
Typography: the body, heading, accent and monospace fonts, and the two display fonts on the Who we are page. Every font comes from Shopify's font library.
Motion: the Motion budget (Full, Balanced or Fast), the Custom cursor and Smooth scrolling. Animations always respect a visitor's reduced-motion preference, and are reduced on low-powered devices whatever you choose.
Branding: your Favicon, the small icon in browser tabs.
Social media: links to your accounts. Their icons appear in the footer.

Select the Header section in the theme editor.

Logo

Upload a Logo, or leave it empty to show your store name as a wordmark. Wordmark replaces the store name, Logo mark adds an emblem beside it (the theme's own ink drop by default), and Show the trailing dot adds the dot after the name. On phones, long names shrink to fit.

Appearance

Let content run behind the header: turn on for templates that open with a full-screen image, so the image starts at the top of the screen under the header.
Adapt to the section behind the header: the header turns transparent with white text over dark sections, and back to its solid light bar over light ones. Turn it off if your hero image is light.

Announcements

Add an Announcement block for each message, such as a delivery or returns note. With more than one, the header rotates through them; Announcement interval sets how long each one shows. Emphasize sets a message in bold.

Navigation links and the mega menu

Create your menus in your Shopify admin, in Content > Menus. Nested menu items (items inside items) show as sub-menus.
In the Header section, the Mega menu label is the button that opens the mega menu.
Add a Mega menu column block for each tab of the mega menu, and choose a Menu for it. Links to collections show the collection's image and description automatically.
To change the image, description or badge of one link, add a Mega menu override block and choose the same link. For links that aren't collections, add the image and description the same way.
Add Navigation link blocks for links that sit beside the mega menu button, such as Shop all. A Badge adds a short word such as New.

If you'd rather not use a Shopify menu, leave a column's Menu empty and add Mega menu item blocks under it, each with a label, link, description, badge and image.

The header also holds search, which shows matching products as shoppers type, the account link and the cart button, whose label is Cart button label. On phones, the menu and search open as sheets from the bottom of the screen.

Select the Footer section.

Tagline, first line, Tagline, second line and Mission statement: the large words at the top of the footer and a sentence about your brand.
Brand mark (your store name if empty) and Address, one line per row.
Show email signup: a newsletter signup. People who sign up are added to your customers with the tag newsletter.
Link column blocks, each showing one menu from Content > Menus. Emphasize this column sets its links in bold.

Some parts of the footer have no settings and appear by themselves:

Social media icons, for each account you link in Theme settings > Social media.
Country and language selectors, when your store sells in more than one country or language. You set those up in Settings > Markets and Settings > Languages.
Follow on Shop, Shopify's button that lets shoppers follow your store in the Shop app, when Shopify makes it available to your store.
Payment icons for the payment methods you accept.

The home page

The home page starts with seven sections, in this order. You can reorder, hide or remove any of them, and add others.

Hero: Full-screen images. Add a Slide block for each image; with more than one, they change every Autoplay interval. Give each slide a Mobile image with a taller crop for phones, where a wide picture would be cut down to a narrow strip, and Alt text that describes it.
Outfit: Four category cards beside a short description of your brand. Choose a Collection for each Category block; the card shows a picture from that collection and reveals a second one on hover. Until you choose collections, the cards link to all products and show a placeholder.
Scroll typography: One Sentence that spells itself out letter by letter as shoppers scroll.
Area of expertise: A deck of cards that fans out as shoppers scroll, one card per Expertise item block, each with a Heading, a Keycap letter and a list of Services, one per line.
Cart recovery banner: A full-screen panel offering a shopper what's in their cart, or what they viewed recently. It appears only when you turn on Show automatically, and then opens a few moments after the page loads.
Confetti call to action: A headline and a button inside a burst of falling confetti. Set the Button label and Button link, for example to your new arrivals. On phones, a quick swipe up moves past it.
Testimonials: Your reviews pinned to a wall as notes, with a masthead and a row of figures. Add a Review block for each review. The Service score, Product score and Trading since figures, the Review platform and the Award badge show only when you fill them in, so enter only figures and awards that are true for your store. The review count counts your review blocks unless you enter one.

The Sections reference lists every setting of every section.

Page transition

Between pages, a full-screen wipe shows your wordmark. It adds about a second to each page change, and it's off for visitors who prefer reduced motion and on low-powered devices. Select the Page transition section in the theme editor to turn it off, change the Wordmark, or change its Speed.

Cart drawer, confirmation and reminder

Cart drawer: A panel that slides in from the side with the cart's contents, a tab of recently viewed products, and express checkout buttons. It opens when a shopper adds something, if you turn on Open when an item is added; it's off by default, so shoppers see the add to cart confirmation instead. The cart button in the header always goes to the cart page.
Add to cart confirmation: A small message in the corner when something is added, with a countdown before it disappears. Time on screen sets how long it stays.
Cart reminder: Off by default. When you turn on Show the reminder, a returning visitor who left items in their cart sees a reminder after the Delay before it appears. It never shows on a first visit or with an empty cart, and waits 24 hours after the shopper heads to checkout, or 4 hours after they close it, before it shows again.

Publish

When the store looks right, go back to Online Store in your Shopify admin, click the button with three dots next to Inkblot, and click Publish.