Icon Theme: Setting up the Product Page
On this page.
- Product media
- Product form options
- Product content options
- Product page content blocks
- Product theme settings
Your product page includes a configurable set of options to shape and display the content that is shared across all products in your store.
To edit the product page section settings, in the theme editor open any product or alternatively click on the template picker and choose Product Page.
The Icon themes product pages support images, video, and 3D Media AR content.
- Enable click to enlarge
Enables a modal window that will show an enlarged version of the image when clicked.
- Gallery Size
Gallery size allows the gallery portion of the product page to take more or less width on the page. The options include a range from small, medium, larger, and ultra where ultra takes the most room for the gallery.
- Gallery Type
There are two Gallery types available for the display of your product images:
- Slideshow with thumbnails:
Shows images in a carousel with accompanying thumbnail images.
- Scroll gallery:
Shows larger images one atop the other with a fixed position product form that stays in view as you scroll down the page.
- Slideshow with thumbnails:
Allows you to select the position of the thumbnail images, choose from Left, Right, and Below the main product image.On mobile, the images will resize and thumbnails will be hidden where customers are able to swipe through the main image carousel.
- Thumbnail Images to Show
The Thumbnail images to show option specified the number of thumbnail images shown near the image slideshow.
If the setting is set to zero then no thumbnail images will appear near the image slideshow.
Slider control styles
Choose between arrows or dots to inform customers that more images are available for viewing.
Enable video looping
When Videos are included within your product media, toggle looping to allow the video to play infinitely.
- Background color
Set the color of the form on the right side of your product page.
Show Back in Stock Form
When enabled a form will appear when a variant that is out of stock has been selected allowing customers to enter their email address.
Show Social Share Icons
Toggles displaying icons for social sharing for Pinterest, Twitter and Facebook.
Product Description Position
Sets the position of where the product description will appear. Can be set to either above product options, beneath product options or below the product image and options.
Lower Description Size
Set the size to either small, medium or large. Set the background color of the lower description. Only available when the Product Description Position is set to "below the product image and options".
Product Shortcode Popups
Use shortcodes in your product description to show links to popups with unique product-specific content. Learn more.
Product Reviews Toggles displaying a Customer Reviews section on the product page. Only works when the free Product Reviews App by Shopify is installed onto the store.
Product page content blocks
The Content Section allows for re-orderable blocks to be used a tabs. Each block becomes a tab that users can click through. The positioning of the tabs are determined from the Product Description Position option mentioned previously. The available tabs include the product description, page content or tab content. There can be a total of 5 blocks added to the content area.
Product page theme settings
The theme settings exist to make changes to content in your store that is used repeatedly.
The following theme settings will also be applied to the Product pages, Home Page featured products section, and products shown within a Quick shop modal.
- Show variant SKU
Displays the SKU for the selected variant
Displays the vendor for products
Show quantity selector
Toggles a quantity selector
Show dynamic checkout button
Lets customers check out directly using a familiar payment method. Learn more
Product variant display.
Toggles between swatch buttons or a dropdown for the selection of product variants
Show color swatches
When swatches are selected from the product variant display (above) you can enable color icons to be used in place of text for variants belonging to a group of options that are named Color or Colour, so instead of the word: "Red" being shown you will see a Red icon for selection.
Color swatch shape
When swatches are enabled choose between square, rectangular or circular for the display of color swatches.
Color swatch style
When the name of your color variants are matched to names of colors in the HTML color chart each swatch will be filled with it's corresponding color tone, it would be impossible for the color chart to understand and preset the exact shade of Red or Blue your item might be so instead of this you can opt to upload your own custom swatch images or have this swatch filled with an image that has been mapped to your variant image within your product admin.
When adding to cart
When an item is added to the cart, you can choose the action to be presented to the customer.
- Open modal/drawer cart: Toggles the drawer or modal chosen in your Cart theme settings
- Go to cart page: Takes the customer to the shopping cart for expedited check out
- Stay on product page and show message: Show a confirmation but stay on the same page.