Guide

Image Specs

 

Homepage

 

Hero Image - 2000 x 1120px

Feature 1 &  6 - 1200 x 550px

Feature 2, 3, 4 & 5 - 1000 x 1000px

 

 

Products

 

Product images - 1600 x 1600px

 

 

Collections

 

Collection image - 1800 x 300px

 

 

Product Colors

 

Product Color Images - 30 x 30px 

 

 

 

 

 

Homepage

 

Theme settings > Homepage

 

The large homepage hero image can be updated. 

 

 

The 6 homepage features have editable images, titles, and links.

To link to an internal page, omit the "oliviaandjoy.com" form the url and begin with a slash ( / ).

 

e.g. to link to a collection titled bags, you would enter /collections/bags

to link to an external site, use the full url, including the "http://"

 

 

The shop more link leads to the selected collection

 

 

 

Global Product Settings

 

Theme Settings > Global Product Settings

 

Products can be filtered and sorted on a collection page.

 

Products can be sorted by Price, Title, or how recently they were added.

Checking an option will allow the user to sort products by that parameter.

 

 

Product pages have a quantity selection dropdown.

You can edit the number of quantity options here.

 

 

The Product Page can display related products ( see more under Products ).

The text for the related product heading can be edited here.

 

 

Product Filters

 

Products can be filtered by Style and Color

 

 

Product Colors

 

Theme Settings > Product Colors

 

The Color Filter list is edited here. Each color should have a name and a color chosen.

Adding an image is optional. If an image is added, it will be used instead of the selected color.

 

 

Product Styles

 

Theme Settings > Product Styles

 

The Style Filter list is edited here. Each style just needs a name.

 

 

A color or style is attributed to a product using tags.

Enter the names of styles and/or colors from one of the filter lists ( more about filter lists above ).

 

 

If a product has a tag matching a color name from the filter list, the color's name will display on the product page.

Only one color will show if multiple tags are entered.

 

 

Products

 

Online Store > Products

 

To add bullet points to the product description, use the bulleted list option.

 

 

 

All images will be shown on the product page.

The first image ( featured image ) will display on collection pages, search pages, related product sections, and in the cart.

 

 

The second image will display when the user hovers over the product.

 

 

Related products can be displayed at the bottom of a product page.

To add ( up to four ) related products, add a tag in the following format:

 

related-product-handle

 

e.g. for a product titled Test Product, with a handle test-product, you would add related-test-product.

 

A product’s handle can be found at the bottom of a product page under edit seo.

It is usually the product title, all lowercase, with dashes in place of spaces.

 

 

Collections

 

Online Store > Products > Collections

 

If an image is added to a collection, it will display at the top of the collection.

On mobile, the center 1/3 of the image is displayed, so be sure to keep important content in that area of the image.

 

 

 

Pages

 

Online Store > Pages

 

A page will automatically display it’s title.

To add a heading, use the formatting button and select Heading 3.

Note that 1 return will break the text to a new line, and 2 returns will add a space between paragraphs.

 

 

 

 

Footer

 

Theme Settings > Footer

 

The social media urls can be edited here.

 

 

Newsletter

 

Theme Settings > Newsletter Signup

 

The Mailchimp action url can be changed to update which list the signup is used for.

Follow the link below the field for instructions on obtaining this url.

 

The newsletter popup title and close text are also editable here.

 

 

 

 

 

Welcome! Save 15% off your first full price purchase

No thanks, I'd rather continue as guest of the brand.