Product pages

Products are the lynchpin of your store.

Familiarise yourself with all the settings available to build your store and your brand correctly, right from the start.

Products can be linked to on your storefront by using sections, images or via text.

Adding a Product

Products are set up through the Products area of the Shopify dashboard.

Shopify have a great guide on how to add products here:

Shopify Help - Adding and updating products

Product descriptions, compare at pricing (sale price), variants and images are outlined here:

Shopify Help - Product details

Note

For more information relating to image sizing for specific sections, see our image FAQ here.

Customising the Product page

Merchants can further customise how the products display in the Product page. Specific information can be set to displayed, if required as-well as various display options for thumbnails, and product descriptions.

To view your product page settings, head to:

  1. Online store → Themes → Customise

  2. Select 'Product pages' from the page selector dropdown,

  3. Select 'Product pages' again from the left-hand settings panel:

This will open all the configurable settings for the product page.

Product Page Settings

Edit how your products display to your customers. With these settings, you can customise the information thats displayed to customers.

We've gone through each of these settings in turn, with a small description of what these settings controls.

Show Vendor

Display the vendor of the product above the product title. The vendor information is set individually, in the product information.

To change this information, navigate to the product in the Shopify dashboard and proceed to edit the Vendor field:

Click on the field to type the name of a vendor. Hit save once done to apply the changes.

Show SKU

This option displays the Stock Keeping Unit assigned to the product. The SKU is set through the product options, on the Shopify dashboard.

When the Show Vendor checkbox is enabled, the SKU will then display on the product for customers to see and displays to the right of the product title.

Show Quantity Selector

Toggle to display a quantity selector for your product. Clicking the plus (+) and minus (-) changes to your quantity before adding the item to cart.

Show Dynamic Checkout Buttons

Enables a 'Buy it now' button, allowing customers to go straight to the checkout with the selected item.

Toggle between hidden and visible.

For more information on Dynamic Checkout Buttons, see our in house documentation here.

Tip

Shopify has official documentation regarding these buttons.

Shopify Help - Dynamic checkout buttons

Show Variant Labels

Enable the checkbox to display labels above the variant dropdown selectors.

Toggle between hidden and visible.

Change Variant based on the thumbnail

Toggle between active and inactive. When active, this feature triggers the dropdown selector to change to reflect the thumbnail clicked.

Enable Out of Stock email

This setting sends an automated email to your store email, to alert you to message the customer when you have stock available for their selected variant.

Hide Out of Stock variants

This option automatically hides variants, as soon as the Out of Stock state is triggered. This is when the inventory count of a product reaches 0.

Cart Button location

Select either “below product description” or “above product description”.

Add to Cart Action

Select how the page should response after the customer hits 'Add to cart':

Show Drawer:

Open the Cart Drawer with the item added:

Show 'Added' message:

Displays a success banner over the Add to Cart Button for a few seconds:

Go to Cart:

Loads the customer through to the Cart Page:

Note:

For more information on the Cart page, please see our detailed documentation here.

Social sharing

Allow customers to share your products right from the product page by toggling these icons:

Product Media

The Media settings control the product image, thumbnails, zooming, and video looping features. This provides a more detailed view for customers when viewing a stores products.

Size

Set the size of the main product image. This can be set to Small, Medium, Large or Full width.

Thumbnail position

Control where the thumbnails sit on the product page. Thumbnails can be set to be either underneath, to the right or left of the main product image.

Image Zoom

Enable or disable zooming on Images when hovering over the product image.

Video Looping

Enable/disable looping on any videos added to the product descriptions.

Note:

For more information on Product Media types, please see Shopify's documentation here.

Reviews

Reviews allow your customers to review your products after purchase. Toggle between hidden and visible.

Review stars appear under your product title:

Note

This feature requires the Product Reviews app by Shopify. We recommended installing this before enabling this feature on the theme.

Product Reviews