Product pages

Build up your store’s offerings and entice buyers with your range of products, displayed in the best possible way.

Overview

Products are the lynchpin of your store. Without products, you would have nothing to sell, so it’s immensely important you master how to add products and 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 images or via text.


How do I add a product?

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

help.shopify.com/manual/products/add-update-products

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

help.shopify.com/manual/products/understanding-products

Note

For further information relating to specific image sizing, see here:
docs.wetheme.com/faqs/what-sizes-should-I-upload-my-images


How can I display or link to my product page on my storefront?

Here are two examples of how you can display your products on your storefront.

The first example is a text link in the footer:

If you need help with setting up footer links, we have a great resource available here:

docs.wetheme.com/envy/footer

Here is a more visual representation of your product/s, using the “featured product” section:

More info is available on specific sections and their options here:

docs.wetheme.com/envy/sections

Once your product link is clicked on, regardless of visual format, your customers will either be taken through to that product’s dedicated page where further details are shown, or if the “add to cart” button is clicked, the product will be added to the cart.

Here is an example of the “image with text” section, linking to a product:


What control do I have over my product page layout?

To view your product page, head here:

  1. Admin
  2. Online store > Themes > Customise
  3. Select 'Product pages' from the page selector dropdown:
  4. Select 'Product pages' again from the left-hand settings panel:

You will see the following options:


Show vendor

Toggle between hidden and visible.


Show quantity selector

Toggle between hidden and visible.


Show dynamic checkout button

Toggle between hidden and visible.

Tip

More information available here: 

help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout

Style and Design: Dynamic Checkout Buttons Guide


Trust badge

You can now upload a trust badge that will display below the Add to Cart button. Trust badges help putting your customers at ease and increasing your store's credibility.


Enable discount savings?

To display how much a product has been discounted compared to the Compare at price, select either Percentage or Value from the dropdown.

Hide

Percentage

Value


Description position

This option always you to define how and where the description should laid out on the page. There are 3 options to choose from:

  1. Above add to cart button
  2. Below add to cart button
  3. Below product image

Enable sticky description

When you enable full size images in the Secondary image display setting, you can enable this feature to ensure the product description remains sticky and visible while the customer scrolls down the images.


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.


Cart button location

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


Social sharing

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

Related products

Toggle between enable and disable. If this section contains more than 4 products, it will turn into a slider. 

Note

This recommendation algorithm uses sales data and product descriptions to show a mix of products that are similar or often bought together. Product recommendations become more accurate over time as new orders and product data become available.

More information on how the "related products" feature works

Heading: Add your own heading text for the related products feed. By default, this reads “other fine products”.


Product images

Note

As of version 14.3, there is a link available directly to our Image Reference Guide, to aid you in getting the best post images selected and edited for your Products.

For those working with a version released before this point, the guide can be found instead below:

WeTheme Images Reference Guide

Image size: Choose between small, medium or large, from the dropdown selector.

Secondary image display: Choose between full size images or an image gallery that highlights one image at a time.

Thumbnail position: Choose between “below main image”, “left of main image” or “right of main image” from the dropdown selector.

Below main image:

Left of main image:

Right of main image:


Enable image zoom

Toggle between enable and disable.

Enabled:

Disabled:


Reviews

Toggle between hidden and visible.

Review stars appear under your product title:

Note

You will need to install Shopify's Product Reviews app before enabling this option:
apps.shopify.com/product-reviews


Enable out of stock email

This option will add an out of stock email signup to your product listing so customers can be notified when the product is back in stock.


Recently Viewed

Enable this setting to display the customer's recently viewed products at the bottom of product pages. You can edit this section's heading, enable quick view functionality and enable auto-height sizing for product images. 

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.