Featured product
Any product, shown like its product page (gallery and product blocks), anywhere on the site. App blocks can be added too.
This section also has the base settings every section shares: color scheme, layout, running head, page number, padding, divider and reveal on scroll.
Settings
| Setting | What it does |
|---|---|
| Product | |
| Gallery layout | On mobile the gallery is always a swipe row. Options: Stacked, Large first, then two columns, Two columns, Mosaic: one large, two small, Carousel, Carousel with thumbnails. Default: stacked. |
| Thumbnail position | Options: Below the image, Beside the image. Default: below. |
| Media shape | Options: Adapt to image, Square, Portrait, Landscape. Default: adapt. |
| Show only the selected variant’s media | Each variant’s image starts a group that runs to the next variant’s image. Media before the first variant image shows for every variant. Default: off. |
| Image zoom | Options: Open in a lightbox, Magnify on hover, None. Default: lightbox. |
| Keep product information in view while scrolling | Default: on. |
| Loop videos | Default: on. |
| Order on mobile | Options: As on desktop, Second page first. Default: same. |
| Content width | Options: Narrow, Normal, Wide. Default: normal. |
| Minimum height | Options: Automatic, Small, Medium, Large, Full screen. Default: none. |
| Background image | |
| Overlay opacity | A layer in the color scheme’s background color keeps text readable over the image. From 0 to 90 %. Default: 60. |
| Padding on mobile | Options: Same as desktop, Smaller, None. Default: same. |
| Visibility | Options: Show on all devices, Hide on mobile, Hide on desktop. Default: all. |
Blocks
Vendor
Product vendor as a small label, linked to the vendor's products.
No settings of its own.
Title
Product title, never shortened. H1 on the product page, H2 elsewhere.
| Setting | What it does |
|---|---|
| Size | Options: Extra large, Large, Medium. Default: h2. |
| Show rating | Leave empty to use the product of the page or card. Ratings come from your reviews app. Default: on. |
Price
Price of the selected variant, with sale, unit price and tax note. Updates with the variant.
| Setting | What it does |
|---|---|
| Show tax note | Shown when prices include taxes. Default: on. |
Variant picker
Variant picker block. See snippets/variant-picker.liquid.
| Setting | What it does |
|---|---|
| Style | Product images: the first option, such as color, shows each value as its variant’s image. Options: Swatches when available, otherwise buttons, Buttons, Product images, Dropdown. Default: auto. |
Quantity
Quantity field with minus and plus buttons. Follows the variant's quantity rule (minimum, maximum, increment). Optional +5 and +10 buttons for bulk buyers.
| Setting | What it does |
|---|---|
| Show +5 and +10 buttons | Default: off. |
Volume pricing
Volume pricing for the selected variant: price per unit at each quantity break. Shown only to B2B buyers whose catalog sets price breaks; renders nothing for everyone else.
No settings of its own.
Add-ons
Add-ons ("popular upgrades"): accessory products the customer can tick, added to the cart in the same request as the product. Each add-on adds its first available variant once. Products that are sold out, or the product itself, are left out. Without JavaScript the product is added on its own.
| Setting | What it does |
|---|---|
| Heading | Default: Popular upgrades. |
| Add-on products | Up to 6. Each adds its first available variant, once, with the product. |
| Style | Options: Panel, Plain. Default: panel. |
| Show icon | Default: on. |
| Note under the list | For example: "Ticked add-ons are added to the cart with the product." |
Buy buttons
Add to cart and accelerated checkout buttons. Owns the product form; the quantity block joins it with the form attribute. Works without JavaScript (posts to /cart/add).
| Setting | What it does |
|---|---|
| Show price in the button | Default: off. |
| Show gift card recipient form | Lets customers send a gift card product to someone by email on a date they choose. Default: on. |
| Show accelerated checkout buttons | Shows the payment methods available in your store, such as Shop Pay or Apple Pay. Default: on. |
| Pre-order message | Shown, with a Pre-order button, when a variant tracks inventory, keeps selling when out of stock and has none left. Default: Ships as soon as it is back in stock.. |
Description
The product description.
No settings of its own.
Collapsible row
A collapsible row of product information. Content comes from text, a page or any metafield connected as a dynamic source.
| Setting | What it does |
|---|---|
| Heading | Default: Shipping and returns. |
| Content | Connect a metafield to show different content for each product. |
| Page | Replaces the content above. |
| Open by default | Default: off. |
Inventory
Stock status from real inventory only: hidden, low stock only (below a threshold) or the exact count. Never shown for untracked inventory. Updates with the selected variant.
| Setting | What it does |
|---|---|
| Show stock | Options: Low stock only, Exact count, Hidden. Default: low. |
| Low stock threshold | From 1 to 20. Default: 5. |
| Show stock bar | Default: off. |
| Full bar at | The bar shows the real stock count against this number of units. From 5 to 100. Default: 20. |
Pickup availability
Pickup availability for the selected variant at the store's pickup locations. Re-rendered with the variant, so it is always current.
No settings of its own.
Installments banner
Shop Pay Installments banner. Shopify shows it only when installments are available for the store and the price.
No settings of its own.
Share
Share button: the device's share sheet where supported, otherwise copy the link.
No settings of its own.
Complementary products
Products that go with this one, from the complementary products you set in the Search and Discovery app. Shows nothing when a product has none.
| Setting | What it does |
|---|---|
| Heading | Default: Pairs well with. |
| Products shown | From 1 to 6. Default: 3. |
Text
A block of rich text.
| Setting | What it does |
|---|---|
| Text | |
| Style | Options: Body, Large, Small. Default: body. |
Heading
A heading. The level sets the HTML tag for the page outline; the size sets the look.
| Setting | What it does |
|---|---|
| Heading | Default: Heading. |
| Size | Options: Extra large, Large, Medium, Small, Label. Default: h2. |
| Heading level | Use H1 once per page, for the main title. Options: H1, H2, H3, Not a heading. Default: h2. |
Button
A link styled as a button or a text link. Without a link it renders as a disabled button so the layout stays visible in the editor.
| Setting | What it does |
|---|---|
| Label | Default: Shop now. |
| Link | |
| Open in a new tab | Default: off. |
| Style | Options: Primary, Secondary, Text link. Default: primary. |
| Size | Options: Small, Medium, Large. Default: medium. |
| Full width | Default: off. |
Countdown
Countdown to a real end date (no fake urgency): the merchant enters a date and time in the store's time zone, or connects a date metafield. Counts down in absolute time, so it is right in every visitor's time zone. Without a valid date it renders nothing. When the time is up it hides itself or shows a message.
| Setting | What it does |
|---|---|
| End date and time | Format: YYYY-MM-DD HH:MM, in your store time zone. You can connect a date metafield instead. Without a valid date the countdown is hidden. |
| Label | Default: Offer ends in. |
| When time is up | Options: Hide the countdown, Show a message. Default: hide. |
| Message | Default: This offer has ended.. |
Spec sheet
Spec sheet: up to 12 rows of label and value, ruled like a page of specifications. Each value can be connected to a product metafield, so every product shows its own specs. Empty rows are skipped.
| Setting | What it does |
|---|---|
| Heading | Default: Specifications. |
| Label 1 | Default: Material. |
| Value 1 | |
| Label 2 | Default: Dimensions. |
| Value 2 | |
| Label 3 | Default: Care. |
| Value 3 | |
| Label 4 | Default: Warranty. |
| Value 4 | |
| Label 5 | |
| Value 5 | |
| Label 6 | |
| Value 6 | |
| Label 7 | |
| Value 7 | |
| Label 8 | |
| Value 8 | |
| Label 9 | |
| Value 9 | |
| Label 10 | |
| Value 10 | |
| Label 11 | |
| Value 11 | |
| Label 12 | |
| Value 12 |
Size chart
Size chart: a link that opens a page (for example a size table) in a dialog.
| Setting | What it does |
|---|---|
| Label | Default: Size chart. |
| Page | Create a page with your size table and choose it here. |
Help drawer
Help drawer: a "Need help?" button that opens a side drawer with the store's own ways to get in touch (phone, email, a chat or messaging link, opening hours) and, optionally, a page such as shipping questions. Nothing is loaded from outside the store.
| Setting | What it does |
|---|---|
| Label | Default: Need help choosing?. |
| Small line | Default: Talk to our team. |
| Photo | A small round photo, for example of your team. Shown instead of the icon. |
| Heading | Default: We are here to help. |
| Text | |
| Phone number | |
| Email address | |
| Messaging link | For example a WhatsApp or Messenger link. It opens in that app; nothing is loaded on your store. |
| Messaging label | Default: Send us a message. |
| Contact page | |
| Opening hours | For example: Sunday to Thursday, 9 to 17. |
| Page | Shown at the end of the drawer, for example common questions. |
Custom option
Custom option: a field the customer fills in before adding to cart, for example an engraving, a monogram or a gift message. Saved on the order line as a line item property (shown in the cart, at checkout and on the order). A required field stops the add to cart with a message.
| Setting | What it does |
|---|---|
| Label | Also the name of the detail on the order, for example Engraving or Gift message. Default: Engraving. |
| Field | Options: Short text, Long text, Dropdown, Checkbox. Default: text. |
| Choices | Separate with commas, for example Serif, Script, Block capitals. |
| Placeholder | |
| Help text | |
| Maximum characters | From 5 to 250. Default: 30. |
| Required | Default: off. |
Sibling products
Sibling products: swatches that link products sold separately, for example one product per color. The family is a collection; connect the setting to a product metafield that points to a collection (Connect dynamic source), so each family uses its own. Works on every Shopify plan. The swatch shows the product's image, a color from a metafield, or a name.
| Setting | What it does |
|---|---|
| Label | Default: Color. |
| Family collection | A collection with every product of the family. Connect it to a product metafield that points to a collection, so each family uses its own. |
| Swatch | Options: Product image, Color, Name. Default: image. |
| Name metafield | Namespace and key of each product’s swatch name, for example custom.color_name. Without it the product title is used. |
| Color metafield | A color metafield on each product, for example custom.color. |
| Maximum swatches | From 2 to 24. Default: 12. |
Back in stock request
Back in stock request, shown only when the selected variant is sold out. Sends the store a contact message with the product and variant, so the merchant can write back when it returns. No app and no automatic emails: the request reaches the merchant's inbox.
| Setting | What it does |
|---|---|
| Text | Default: Sold out. Leave your email and we will let you know when it is back.. |
Icon with text
A small icon next to a short line of text, for promises such as free returns.
| Setting | What it does |
|---|---|
| Icon | Options: Shipping, Returns, Secure payment, Gift, Natural, Support, Quality, Fast, Worldwide, Packaging, Shine, Check, Heart, Shield, Phone, Email, Location, Calendar, Tag, Percent, Payment card, Store, Water, Sun, Handmade, Award, People, Recycle, Fast, Tailoring, Battery, Bluetooth, Weight, Processor, Screen, Wi-Fi, Charging, Speaker. Default: truck. |
| Text | Default: Free returns within 30 days. |
Key specs
Key specs: short facts as chips, each an icon, a value and a label ("35 h, battery life"). A value can be connected to a product metafield; chips without a value are left out.
| Setting | What it does |
|---|---|
| Heading | Default: Product highlights. |
| Columns | From 2 to 6. Default: 4. |
| Columns on mobile | Options: 1, 2, 3. Default: 2. |
| Style | Options: Panel, Plain. Default: panel. |
App blocks can be added to this section.