Product page blocks

Reel’s product page is one Product section with blocks you can add, remove and reorder. Below it sits a Related products section. This guide covers the section settings, each block, swatches, quick add and the buy bar on phones.

1. Open a product page in the editor

Go to Online Store → Themes → Customize. In the page menu at the top, choose Products → Default product. Changes here apply to every product that uses the default template.

2. Section settings

Click Product in the left panel.

• Media layout: Stacked, Thumbnails or Carousel. This applies on wide screens. On phones and tablets, the media is always a row shoppers swipe through.
• Image shape: Portrait 4:5, Tall 2:3 or Square.
• Show buy bar on phones while scrolling: see section 6.
• Color scheme.

When a shopper picks a variant that has its own image, that image moves to the front. Videos and 3D models you add to a product play in the gallery. No app is needed.

3. The blocks

• Vendor: the product’s vendor.
• Title.
• Price: the price, a line about taxes, and Shop Pay Installments when you offer them.
• Variant picker: Style is Buttons or Dropdowns. Colour options always show as swatches, whichever style you pick. Sold-out values stay visible. Buttons get a line through them and swatches fade.
• Inventory: shows “In stock”, or “3 left” when stock falls below Low stock below (1 to 20, default 5). It only shows for variants whose inventory Shopify tracks.
• Buy buttons: the add to bag button, with Show quantity, Show express checkout buttons and Show pickup availability. When a product has subscription options, they appear here too.
• Description.
• Size guide and Collapsible row: fold-out rows. See Size guide and care.
• Text: a short line, for example your returns promise.
• SKU: the selected variant’s SKU.
• Share: a link that opens the device’s share menu, or copies the link.
• Complementary products: “Wear it with” products. Choose them per product in the Search & Discovery app. Set the Heading and up to six Products.
• Apps: blocks from apps you install.

4. Swatches

The variant picker shows an option as swatches when its name is in Theme settings → Swatches → Option names shown as swatches. The colours come from Shopify’s swatches, then from your Swatch colors list, then from the value’s name. See Choose a preset, fonts and colours for how to set them.

5. Quick add

Quick add lets shoppers pick a variant and add to the bag from a small sheet, without opening the product page. Turn it on or off in Theme settings → Product cards → Enable quick add.

When it’s on, a plus button appears on product cards for products that are in stock. Lookbook hotspot cards show an Add to bag button. The sheet shows the image, price, options and a link to the full product page. It has no quantity selector: shoppers add one at a time.

The “Goes with it” row in the cart drawer also opens quick add. That row has its own setting; see Cart drawer or cart page.

6. Buy bar on phones

With Show buy bar on phones while scrolling on, a bar appears at the bottom of the screen on phones and tablets once the main add button scrolls out of view. It shows the title, the selected variant, the price and an add button. The bar needs the Buy buttons block on the page.

7. Related products

The Related products section below the product shows products Shopify picks from your sales data. Set the Heading and how many Products to show, 2 to 5. To adjust the picks, use the Search & Discovery app.