Product pages
Every product uses the default product template unless you assign it another one. The template holds four sections: Product, then Product specs, Product recommendations and Recently viewed products.
To edit it, go to Online Store > Themes > Customize, then choose Products > Default product from the page menu at the top of the editor.
The product register
Section titled “The product register”The Product section has a Layout setting, and the template ships with Register. In this layout the page opens on one ruled row that names the product:
- The selected variant’s SKU. A variant with no SKU leaves the cell out and the row starts at the title.
- The product title, from the Product title block, as the page’s main heading.
- The spec line, a short fact such as “Ceramides 3% · Panthenol 5%”, under the title. It comes from the product’s subtitle metafield, described below.
- The price, from the Price block, with the compare-at price struck through when it is higher, the unit price when the variant has one, and “Taxes included.” when your prices include tax.
Under the row sits the configure line, the Purchase options block. It reads in the order a shopper decides: the options, then the subscription plans, then the quantity, then the “Add” button, with the accelerated checkout buttons beside it. “Add” reads “Sold out” when the variant is sold out. On phones each part takes a line of its own, and “Add” spans the full width.
Under the configure line, the gallery sits beside the product sheet: the blocks you add to the section, such as the description and key facts. On phones the gallery comes first, above the row and the configure line, so the page opens on the product’s images.
When a shopper picks another variant or plan, the row, the configure line and the sheet update to match.
The spec line
Section titled “The spec line”The spec line is the value of the product’s descriptors.subtitle metafield, Shopify’s standard Product subtitle definition. Fine Print shows it in the register row, under the title in the other layouts, on product cards, in the collection register, in quick view and in search results. A product with no subtitle shows none, and the row keeps its height.
To fill it, add the Product subtitle definition to your products, then enter a subtitle on each product page in your Shopify admin. See Shopify’s guide to metafield definitions.
The other layouts
Section titled “The other layouts”Stack, Carousel and Grid put the gallery on the left and an information column on the right. That column starts with two fixed blocks, Product title and Price, then the Purchase options block, then the blocks you add. In the Register layout the same two blocks fill the row, and you edit them from the sidebar as in the other layouts.
- Product title shows Vendor or Product type above the title, chosen with Label above the product title, and the spec line under it. Show rating adds the average rating and review count from the
reviews.ratingandreviews.rating_countmetafields that review apps write. Its heading settings set the title’s tag and size. These settings apply in the register row too. The template ships with None as the label and a 44 px title. - Price shows the price, a sale badge with the saving, a “Sold out” badge, a “New” badge for products tagged
new, and a “Subscribe and save” badge for products with subscription plans. It shows at most two badges. In the register row it shows the price without badges.
Purchase options
Section titled “Purchase options”The Purchase options block is fixed in the Product section. You can’t remove it, but you can add, remove and reorder the blocks inside it:
- Variant picker shows one group per option. An option with more than 6 values shows as a dropdown. Up to 6, an option whose values have swatches shows swatches while Show swatches is on, the default. Other options, and every option with Show swatches off, follow Options without swatches: Buttons or Dropdown. A product with no options shows no picker.
- Subscription plans shows one-time purchase and subscription choices. See Subscriptions.
- Buy buttons holds the quantity field, the “Add” button and Shopify’s accelerated checkout buttons.
- Inventory note shows stock for the selected variant.
- Pickup availability shows where shoppers can collect the variant.
- Product custom liquid runs Liquid code you write. In the Register layout it takes a line of its own.
The block also accepts app blocks.
Buy buttons
Section titled “Buy buttons”Show accelerated checkout buttons adds Shopify’s accelerated checkout buttons, such as Shop Pay or Apple Pay. In the Register layout they sit under the label “Express checkout”. Which buttons show depends on your payment settings and the shopper’s device. See Shopify’s guide to accelerated checkout buttons.
The quantity field follows the variant’s quantity rules. A minimum, a maximum or an increment shows under the field, such as “Min 2”. When the shopper’s B2B catalog has volume pricing, the price breaks show under it too.
Gift card products show a “Send as a gift” checkbox with fields for the recipient. The Gift cards guide covers them.
Inventory note
Section titled “Inventory note”The Inventory note reads the stock of the selected variant, for variants whose inventory Shopify tracks:
- With 1 up to Low stock threshold units left, it reads “Only 3 left”. The threshold runs from 1 to 50 and starts at 5.
- With more left, it reads “In stock” while Show the “In stock” label above the threshold is on.
- Out of stock but set to keep selling, it shows the Backorder text, which starts as “Available on backorder”. Change it to a delivery promise you can keep, such as “Ships in 2 weeks”.
A variant whose inventory Shopify does not track shows no note.
Pickup availability
Section titled “Pickup availability”The Pickup availability block shows the first location that offers pickup for the selected variant, such as “Pickup available at Main Street”, with its pickup time. A “Check other stores” button opens a panel that lists each pickup location with its status, address and phone number. With one location, the button reads “View store info”.
The block stays empty when no location offers pickup for the variant. Turn on local pickup for your locations from your Shopify admin, under Settings > Shipping and delivery. See Shopify’s guide to local pickup.
The product sheet
Section titled “The product sheet”The blocks you add to the Product section form the product sheet. Each block draws a rule above itself. The section accepts:
- Description, the product’s description from your admin. It hides when the description is blank.
- Key facts, a ruled list of facts under a heading, in one or two columns.
- How to, numbered steps such as “How to use”.
- Collapsible tab, a row that opens to show text, for shipping, returns or a size guide.
- Complementary products, products that go with this one.
- Share, a “Copy link” button and, in browsers that have a share sheet, a “Share” button.
- Product custom liquid, Liquid code you write.
- App blocks.
Key facts and metafields
Section titled “Key facts and metafields”A Key facts block holds Spec row blocks. Each row has a Label and a Value. To give every product its own value, connect Value to a product metafield with the dynamic source button next to the field, for example a “Key actives” row connected to a key actives metafield.
Fine Print has no fixed spec metafields. You create the metafields that suit your products, and the template ships with its rows unconnected. See Shopify’s guides to metafield definitions and showing metafields in your theme.
A row with no value hides on your store, and a list with no values hides completely. In the theme editor, empty rows and lists show a note so you can still select them.
How to
Section titled “How to”The How to block turns rich text into numbered steps, 01, 02 and on. Each paragraph or list item becomes one step. Connect Steps to a rich text product metafield so each product shows its own steps. With no steps, the block hides on your store.
Collapsible tabs
Section titled “Collapsible tabs”A Collapsible tab shows its Heading, an optional Icon, and the Content you enter. Choose a Page instead to show that page’s content. The page replaces the text. Open by default starts the tab open. A tab with no content hides on your store.
Complementary products
Section titled “Complementary products”The Complementary products block lists up to three products as rows, each with an “Add” button, or a “View” link to the product page for products with several variants. Products to show sets how many, from 1 to 3.
The block shows only products you pick in Shopify’s Search & Discovery app. From your Shopify admin, go to Apps > Search & Discovery > Product recommendations and add complementary products to the product. See Shopify’s guide to product recommendations. A product with no picks shows no block on your store.
Media gallery
Section titled “Media gallery”The gallery shows the images, videos and 3D models you add to the product in your Shopify admin. The selected variant’s image comes first, and picking another variant moves the gallery to that variant’s image. Shopify’s guide to product media covers uploading them.
Layout sets how the gallery looks on wide screens:
- Register shows the media in a strip that scrolls sideways, with the next item peeking past the first, a counter such as “1 / 4”, and arrows.
- Stack shows every item in one column, and the information column stays in view as the shopper scrolls.
- Carousel shows one item at a time with arrows, a counter and a row of thumbnails.
- Grid shows the items in two columns, with the first item full width.
On phones every layout becomes a row that shoppers swipe through, with a counter.
Open images full screen is on by default. A press on an image opens it in a full-screen viewer, where shoppers swipe or use the arrows to move between images. Videos and 3D models play in place. A 3D model shows a “View in your space” button on devices that support augmented reality.
Sticky add to cart
Section titled “Sticky add to cart”Show a bar when the buy buttons scroll out of view is on by default. The bar appears at the bottom of the screen once the shopper scrolls past the buy area, and hides while the accelerated checkout buttons or the footer are in view.
- In the Register layout the register row docks at the bottom: SKU, title, the chosen options and plan in place of the spec line, price and “Add”. It appears once the configure line has scrolled out of view.
- In the other layouts the bar shows the variant image, the title, the chosen options and plan, the price and an “Add” button.
A long title wraps onto a second line, and the bar grows to fit it. When the shopper still has to pick an option, the bar’s button reads “Select options” and scrolls back to the options.
Sections under the product
Section titled “Sections under the product”- Product specs shows a full specification table in Spec group blocks. Each group has a Group name and holds Spec row and Spec text blocks. Spec text takes rich text, for long values such as a full ingredient list. Layout set to Table shows each group name as a row over its specs, with every group open. Two columns puts the group names in a left column on wide screens. On phones each group opens and closes like an accordion, with the first one open. Groups with no values hide, and the section hides until a row has a value. Note under the table adds text under the groups.
- Product recommendations shows the related products Shopify recommends for the product. With none, the section hides on your store.
- Recently viewed products shows the products this shopper viewed last on this browser, newest first, leaving out the current product. With no history, it hides.
Both product rows offer Products to show, Layout set to Grid or Carousel, Columns on desktop, and an optional “View all” link.
Alternate product templates
Section titled “Alternate product templates”Use an alternate template when a group of products needs a different sheet, such as other spec rows for a second product line.
- In the theme editor, open the page menu at the top, go to Products, and click Create template.
- Name it, choose the template to copy, and click Create template.
- Change the blocks and sections in the new template.
- From your Shopify admin, go to Products, open a product, and choose the new template under Theme template. Click Save.
Shopify’s guide to templates covers assigning a template to many products at once.