Borders > Product page
The product page is the most important page on your store, where the actual purchases happen, so you need to carefully set this up in order to make sure that it converts in the best possible. Our theme has all the tools you need to achieve this, so let's get started.
Product page options
Gallery
The first options are the ones related to the gallery style. You can choose between scrolling and swiping slider, though on mobile it will always be swiping. You can also choose the gallery size on desktop devices, which helps to put more emphasis on the pictures vs text, depending on what's your store's focus point.
You also have lots of options for the gallery, such as setting the aspect ratio, adding a media shape, putting borders around the media, playing with the radius / padding, etc.
Because the aspect ratio of the gallery is fixed, make sure that you choose the setting which is the closest to your product images, in order to reduce the level of cropping you'll get.
Content & functionality
More about styling, you have the option to hide all borders in the product page completely, while the last option gives you the possibility to start without a default variant, and force the user is selecting something in order to enable the purchase flow.
Product blocks
After setting up the gallery, you can change the content of the product page using blocks, so you can really achieve a lot of things with different products, page templates, metafields and more.
Vendor - Displays the product's vendor with a link to the vendor collection page (created automatically)
Title - Product title with some typography options
Price
SKU / barcode
Tax information - Displays a "tax included" notice for stores where this is a legal requirement
Description - You have a lot of options for setting up the typography, based on how large are your descriptions, plus an option to truncate the large ones
Icons / tags list - A place where you can also add static icons or connect metafields that you are using for the individual product labels / icons .. If not all products have icons, you can even connect the title to a dynamic source in order for it to only appear when you want it to appear. This is versatile area because you can have different titles and different icons for each product page you're having.
Variant picker - It has two types of selectors and also gives you the possibility to display a dynamic size guide. To set up the size guide, first of all you need to choose an option name for the variant that will be used for this field, in the same way you did for the color swatches. Only when the product page will detect one of these options present, it will show up the block.
Right after this, you can write a label for the size guide and connect a page, that can open in the same window, a new one or as a popup.
Tip #1: Use metafields or page templates in order to set up unique size guides for different products on your store
Tip #2: This option isn't limited to size guides only, you can use it for absolutely anything you want, even offering information about variants.
Buy buttons - With a couple of nice options, such as the ability to show the left inventory, quantity selector, dynamic buttons, etc. It even allows you to set a unique color scheme for the buttons, if you want to have a stand out color to assist in conversion.
Share - For sharing on popular social platforms
Product badges - Will display the same badges that are configured in the product card.
Product rating - Will display the product rating as configured in the product card.
Complementary products - This is an automated section which shows content that you need to set up in the Product Recommendations App.
Tabs - A block that gives you up to three different tabs to write various product related content