Getting started

This page takes you from a freshly installed theme to a storefront that looks like your brand. It should take about twenty minutes, and you will not need to touch any code.

Install the theme

From the Shopify Theme Store. Open Instant’s page in the Theme Store and choose Try theme to add it to your store for free, or Buy theme to own it. Either way it lands in your Theme library under Online Store → Themes. A trial theme can be customized fully; you pay only when you publish it.

From a zip file. If FourCore sent you the theme directly, or you are testing a build:

In your Shopify admin, go to Online Store → Themes.
Under Theme library, choose Add theme → Upload zip file.
Select the Instant zip file and wait for the upload to finish.

In both cases Instant now sits in your library. It is not live yet, so nothing your customers see has changed.

Open the editor

Choose Customize next to Instant. This opens the theme editor, which has three parts.

On the left is the page you are editing, built from sections. This is where you add, reorder and remove the pieces of a page.
In the middle is a live preview of your storefront.
On the right are the settings for whatever you have selected.

The dropdown at the top of the middle column switches between pages: home page, a product, a collection, and so on. What you see on the left always belongs to the page named there.

Set up your brand first

Six settings do most of the work. Open Theme settings, the gear icon in the editor’s left column. Shopify moves it now and then, so look for the gear rather than a fixed spot.

Logo and favicon

Logos and favicon takes your logo once and uses it everywhere: the header, the password page, and the browser tab. Upload the largest clean version you have. The theme resizes it for every screen, so you do not need separate files.

Colors

Instant uses color schemes rather than loose colour settings. A scheme is a complete set that works together: background, text, headings, borders, an accent, and the three button styles. Every section then chooses which scheme it uses.

That is why you will not find a “background colour” on each section. You pick a scheme, and the section takes its whole palette from it. Change a scheme once and every section using it follows.

Typography

Typography sets three roles: headings, body, and a smaller accent face used for labels and short supporting text. Choose the fonts once here and the whole store follows. Sizes are set as a scale, so making headings larger keeps the relationship between them intact.

Buttons

Buttons decides the shape of every button in the theme: how round the corners are, how much padding, the border, and the type. There is also a Hover background and Hover text on each button role inside a colour scheme; leave those empty and the theme darkens the button slightly on its own.

Layout

Layout sets the page width and how much space sits at the edges of the screen. Sections that are set to “Boxed” follow this width; sections set to “Full width” always reach the edges of the screen.

Animations

Animations is one store-wide switch. Turn it on to enable the theme’s motion effects, or turn it off to stop decorative motion throughout the store. You do not need to manage animation settings section by section.

Build the home page

Back on the home page, use Add section to build the page. Sections are grouped by what they do, so if you want a picture across the screen, look under Banners.

Each section has its own settings on the right, and most have blocks inside them: a slideshow has slides, a multicolumn has columns. Drag to reorder, and use the eye icon to hide a section without deleting it.

Publish

When you are happy, go back to Online Store → Themes, find Instant in your library, and choose Publish. Your storefront changes at that moment.