Site Background- 2000 x 1120px
Homepage Story - 2000 x 1120px
Collection Background - 2000 x 1120px
Collection Lookbook Images - 1600px wide (any height)
Product Images - 1100 x 660px
Text Page Images - 1600px wide (any height)
404 Textbox Image - 1000 x 666px
Edited under Theme Settings > Site Background
The ‘Background Color’ is displayed as the sites's default background color, and is shown if a background image is loading.
The ‘Background Image’ is displayed as the background for the entire site. You are able to override this image for collections (see Collections section below).
Edited under Theme Settings > Homepage Story
The homepage story allows the user to click through a series of animated images. When clicking the finial image, the user is directed to a collection of your choice.
The ‘Story Collection’ setting determines which collection the final image will lead to.
The ‘Background Color’ setting adjusts the background color displayed while the images are loading.
It is best to use a color taken from the background of the first image.
Up to 20 images can be added to the homepage story. Each image can be added by clicking either the ‘Choose file’ or the ‘Replace’ button.
To enable an image, check the ‘Show Image’ Checkbox.
Edited under Products > Collections
To show a specific background image on a collection ( and override the site background image ), upload an image to the ‘Collection Image’ option. This image will also display as the background for all products within that collection.
Supplemental Collection Lookbook Images edited under Theme Settings > Collections
Each collection can have up to 12 Lookbook Images which are displayed between products on the collection page. If there are fewer images than needed for a collection, the available images will be repeated to fill all the lookbook spaces.
To add images to a collection, first navigate to one of the ten available collection sections and select the appropriate collection using the ‘Collection’ dropdown. This will associate the images with your collection.
Then, upload up to 12 images to the ‘Lookbook Image’ slots. Check the ‘Show Lookbook Image’ checkbox to enable an image.
Each of these images should be .png files, with transparent backgrounds. To create a collage effect, many of the images should be composites of multiple images on top of, or next to each other.
Edited under Theme Settings > Product Animation
By default, each product has animation enabled. When the user scrolls on a collection page, each product will spin showing a 360 degree view.
The ‘Animation Speed’ dropdown can be used to make the animations faster or slower. This can be changed at any time.
The ‘Number of Animation Frames’ determines how many frames are used for the animation. It is IMPORTANT to note that changing this value MUST be accompanied by updating the number of all product animation images.
Unless animation is disable on a product (see more below) the first X images (X is your selected number of frames) are used for the animation only, and will not be displayed on the product page. Every image after X can be displayed on the product page.
To disable animation on a product and show a static image instead, add the tag ‘static-image’ to the product. This will show the first image on the collection page, and allow any of the images to be displayed on the product page.
Edited under Products
Adding color variants (and an image for each) will allow the user to change the product color by hovering left to right, over the product image. Clicking the image allows the user to select the current color and will open a secondary variant options (e.g. Size).
Start by creating color variants and uploading an image for each color.
Hover over each color image, and click the ‘Alt’ button. Enter the name of the appropriate color EXACTLY as it is entered for the variant.
e.g. if a color variant is named ‘light blue’, the alt tag must also be ‘light blue’. Be sure any capitalization or spaces are the same as well.
Edited under > Online Store > Pages
The page title is automatically displayed at the top of the page. You can use the ‘A’ (formatting) button above the content editor to create a heading with any of the Heading 1-6 options.
Edited under > Theme Settings > Newsletter Signup
The action url for a Mailchimp list can be added here. ( Follow the link below the setting for detailed instructions )
Edited under Theme Settings > 404 Error Page
This page is displayed when the user navigates to a page that doesn’t exist.
You can edit the message and redirection link here.
The ’Text Box Background’ image must be uploaded, and will display behind the message and back to shop button.