# The product page

Chapter 6 of the Dose user guide.

## The two product templates

| Template | Assign it to | What's on it |
| --- | --- | --- |
| `product` (the default) | Every supplement | Tags, title, short description, price, variant picker, stock line, buy buttons with the purchase options and the **Supply calculator**, back-in-stock request, **Trust row**, pickup, and the **How to take** and **Shipping and returns** accordions. Under it, **Facts and ingredients** (the **Supplement facts** panel and **Ingredients and evidence**), then **Product recommendations** ("Goes well with"). |
| `product.accessory` | Pill organisers, shakers, bottles: anything without supplement facts | The same buy box without the supply calculator, no Facts and ingredients section, and a recommendations row ("Fill it up" in the Dose preset) |

To assign one, open the product in Shopify admin and choose it in the **Theme template** field, then **Save**. A new product starts on `product`.

To change a template, open the theme editor, click the page selector at the top, choose **Products** and pick the template. Changes apply to every product using it. Fixed words on a template, such as the trust row or an accordion, show on every product that uses it, so keep them true of all of them. Words that differ per product, such as directions for use, belong in the product's description or a metafield connected to a **Collapsible row** (chapter 5).

## The Product section

| Setting | Default | What it does |
| --- | --- | --- |
| Show breadcrumbs | On | |
| Enable image zoom | On | Adds a zoom button to each image and opens images full screen |
| Pre-orders | Off | See **Pre-orders** below |

The gallery shows your main photo in a large rounded square on the product's goal colour, with square thumbnails under it (on phones, a swipe carousel with dots and "1 of 5"). It takes images, video, external video and 3D models. Choosing a variant shows that variant's image if it has one. From 990px the buy box beside it stays in view as the page scrolls. Photograph your bottles on a plain or transparent background so the goal colour shows round them.

## Product page blocks

| Block | Settings | What it shows |
| --- | --- | --- |
| Tags | **Show format tag** (on), **Goal tags** (3, from 0 to 6) | The format from `custom.format` with its icon ("Gummy"), then the goals from `custom.goals`, each with its goal colour's dot |
| Product metadata | **Show vendor in metadata** (off) | A small line above the title: the product type, the vendor if you turn it on, and the SKU |
| Product vendor | | The vendor, linked to its collection |
| Title | **Show rating** (on) | The name, and the stars and "4.8 · 1,284 reviews" from the rating metafields review apps write (`reviews.rating`, `reviews.rating_count`) |
| Description | **Description**: **Short: the tagline or first paragraph** (default) or **Full description** | The short form is the product's `custom.tagline` when it has one, else the first paragraph of the description. **The shipped templates show only this short form**, so put the most useful paragraph first, choose **Full description**, or add a **Collapsible row** with the full text. |
| Price | **Show tax note** (on, but off in the shipped templates), **Hide when purchase options show prices** (on) | The price, a struck compare-at price and the unit price. On a product with delivery plans it steps aside, because the purchase options print both prices. |
| Inventory | **In stock words** ("In stock, ships tomorrow"; Botanic "In stock, ships from the farm in two days") | The stock line: your words with a tick while the variant is in stock, "Only 4 left" with a small dot at or under **Show "Only 4 left" at or under** (Theme settings › Badges), "Sold out", or "Pre-order" |
| Variant picker | | The options (see below) |
| Buy buttons | See below | The purchase options, the quantity, the add to bag button and everything around it |
| Supply calculator | See chapter 10 | How long a container lasts, inside the Subscribe and save option |
| Back-in-stock request | **Heading** ("Notify me when available"), **Text** ("Leave your email and we'll write to you when it's back in stock.") | See below |
| Trust row | Four lines, each with an **Icon** and a **Line**: Truck "Free shipping on subscriptions", Repeat "Change your delivery any time", Flask (tested) "Third-party tested every batch", Shield "30-day money-back promise" | Up to four short promises in a 2 × 2 grid. A blank line is left out. Botanic and Fuel change the first and third lines. Rewrite them to your own. |
| Pickup availability | | See below |
| Share | | A share link |
| Specifications | **Heading** ("Specifications"), **Spec row position**, and switches for the SKU, product type, vendor, weight and variant options (on) and barcode (off) | A two-column table from your product data, not on the shipped templates. Add **Specification row** blocks inside it (**Label**, **Product metafield**, **Value**, **Unit**) to show a metafield such as `custom.made_in`; change the sample label "Made in" to match. A row with no value is hidden. |
| Supplement facts | See chapter 8 | The facts label. It's fixed in **Facts and ingredients**, but you can add it to the Product section too. |
| Ingredients and evidence | See chapter 11 | Ingredient cards, certification chips, the format chip and the lab report |

The trust row icons are **None**, **Truck**, **Repeat**, **Flask (tested)**, **Shield**, **Leaf (vegan)**, **Check mark**, **Clock**, **Gift**, **Heart**, **Lock**, **Pin**, **Shop** and **Chat**.

Add the general blocks in chapter 5 too, and app blocks, such as a reviews app's star rating.

**Buy buttons** settings:

| Setting | Default | What it does |
| --- | --- | --- |
| Show subscription options | On | Appears when the product has delivery plans (chapter 10) |
| Show quantity selector | On | |
| Show accelerated checkout buttons | On | Shop Pay, Apple Pay and the like. Customers see the payment methods available on their device. Hidden while a delivery plan is chosen. |
| Show Shop Pay Installments | On | Appears when Shop Pay Installments is enabled on your store |
| Show sticky add-to-cart bar | On | Product pages only. Appears when the add to bag button scrolls out of view: a small picture on the goal colour, the name, the chosen plan, the price and the button. |
| Show free shipping note | Off | A line under the button, "Free shipping over $60.", with the threshold from **Theme settings › Commerce** |
| Returns note | | Shown under the add to bag button. Leave it empty to hide. |

The button reads "Add to bag · $34.00", and its price follows the variant, the purchase option (a delivery plan shows its own price, such as "$28.90" at 15% off) and the quantity.

## Variants and swatches

* Each option is a row of rounded chips, with the chosen value shown beside the option's name. Name your sizes by count, such as "30 gummies", "60 gummies" and "90 gummies", so shoppers see what they get.
* A value with a swatch (a colour or image set on the option in Shopify admin, such as a flavour colour) leads with a small dot of that colour.
* An option with more than eight values and no swatches is a dropdown.

A combination you don't sell stays selectable, struck through, and the button says it's unavailable. The page updates in place as shoppers choose, and the address follows the variant so it can be shared. Products with more than 250 variants work, and so do Shopify combined listings.

For sizes with a different count, give each variant its own `custom.servings` (chapter 7): the supply calculator and the serving chip then follow the variant chosen.

## Pickup

**Pickup availability** shows whether the selected variant can be collected, and where. It shows nothing unless you've turned on **Pickup in store** for a location in **Settings › Shipping and delivery**.

## Pre-orders

Two opt-ins, both off, in the Product and Featured product sections:

* **Show oversold variants as pre-orders**: for tracked variants that keep selling at zero stock ("Continue selling when out of stock" in Shopify admin), such as a new flavour you're taking orders for.
* **Show single-delivery purchase options as pre-orders**: for products sold only through a pre-order app. Leave it off for try before you buy.

When a variant qualifies, the button and stock line say pre-order. Product cards show a **Pre-order** badge by the same rules once you turn on **Show "Pre-order" on product cards** (Theme settings › Badges, chapter 2). **Pre-order note** is shown under the button, for example "Ships in March": give a date or a range. To choose per product instead of for the whole template, connect a true or false product metafield to the opt-in, and a product metafield to the note, with the dynamic source button.

## Subscriptions

With a subscription app, the buy box shows the product's purchase options as two cards: **One-time purchase**, and **Subscribe and save** with its saving ("Save 15%"), its price, the supply calculator and "Deliver every [30 days]". The calculator preselects the plan that matches the daily dose. Chapter 10 has the details.

## Back-in-stock request

Under a sold-out variant, shoppers can leave their email. Each request is emailed to your store's sender address (**Settings › Notifications**), naming the product and variant. **Nothing is sent to shoppers automatically: reply when the stock is back.** For automatic emails, use a back-in-stock app instead and remove this block.

## Gift cards

Gift card products show Shopify's recipient fields, so a shopper can send the card to someone else on a chosen date. Accelerated checkout buttons never show on a gift card.

## Quick view

With **Show quick view button** on, or **Show quick add button** on a product with options, cards open the product in a panel with its gallery, price, stock line, options and buy buttons, then **View full details**. The purchase options are there, with the supply calculator folded into one line, "Lasts 30 days · delivery every 30 days", and a **See supplement facts** link to the facts panel on the product page, with the matching plan already chosen.

Quick view can't read your product templates' block settings. It uses each block's default settings, so **Accelerated checkout buttons** show there, the stock line uses the default words, and the Product section's pre-order opt-ins don't reach it.

## B2B

Shopify B2B is available on the Basic, Grow, Advanced and Shopify Plus plans, not on Starter or Retail, and what you can use depends on your plan. For customers buying for a company location, such as a clinic, a pharmacy or a gym reordering stock, the buy box shows their catalog's quantity rules ("Minimum 12 · Multiples of 6") and volume pricing. Everyone else sees no change.

**Quick order list** (product pages only) lists every variant of a product in a table with quantity fields. **Heading** ("Quick order"), **Variants per page** (25, from 10 to 50 in steps of 5) and **Show SKU** (on). It adds one-time purchases, and it doesn't show on a product with only one variant or a product that requires a delivery plan.
