Product page
The product page is built from a single section, Product information, with a block-driven info column. You control what appears and in what order by adding, removing, and reordering blocks in the theme editor, rather than editing template code.
Section settings
These settings on the Product information section control the gallery and overall page behavior, separate from the blocks in the info column.
| Setting | What it does |
|---|---|
| Show breadcrumbs | Displays the collection/product trail above the info column. |
| Sticky product info on desktop | Pins the info column in place while the customer scrolls through the media gallery. |
| Show sticky Add to cart bar when scrolling | Shows a persistent bar with price and buy button once the main buy buttons scroll out of view. |
| Enable image zoom | Lets customers zoom into gallery images on hover or tap. |
| Thumbnail position | Controls where gallery thumbnails sit relative to the main image. |
| Autoplay videos | Automatically plays video media in the gallery when it scrolls into view. |
| Color scheme | Sets the color scheme applied to this section, chosen from Theme Settings. |
| Top padding | Space above the section, in pixels. |
| Bottom padding | Space below the section, in pixels. |
Media gallery
The gallery supports standard images, video, and 3D models alongside each other, so you can mix product photography with a short video clip or an interactive model on the same product without any extra setup beyond uploading the media in Shopify admin. Thumbnail position and image zoom are both controlled from the section settings above.
If you order a video as the first media item in a product's media list, it always autoplays, loops, and plays muted as soon as the page loads, regardless of the Autoplay videos setting above. This is designed for a hero-style product video that sets the tone the moment a shopper lands on the page. The Autoplay videos setting controls autoplay for any other video in the gallery, which plays muted but does not loop, and can always be opened, paused, or unmuted manually using the built-in video controls.
Buy box blocks
Everything below the gallery, title, price, variant picker, buy buttons, description, and more, is a block. Blocks can be reordered freely in the theme editor, which means you can, for example, move the accordion above the buy buttons, or put SKU and inventory status right under the title. The full block list is below.
| Block | What it does |
|---|---|
| Title | Product title. |
| Price | Current price, including compare-at price when the product is on sale. |
| Rating | Star rating, pulled from your reviews app if one is connected. |
| Variant picker | Option selectors for size, color, and any other variant options. |
| Quantity selector | Stepper for choosing how many to add to cart. |
| Buy buttons | Add to cart and accelerated checkout buttons. |
| Description | The product description from Shopify admin. |
| SKU | Displays the variant SKU. |
| Inventory status | Shows stock level or availability messaging. |
| Share | Social share links for the product. |
| Accordion | Collapsible content blocks, useful for shipping info, sizing charts, or care instructions. |
| Custom Liquid | Drop in your own Liquid code or an app embed at any point in the info column. |
| Related products | A short list of related products. |
| Featured collection | Embeds a collection preview within the info column. |
| Recently viewed products | Shows products the customer has recently browsed. |
| Complementary products | Shopify's complementary product recommendations for this product. |
| Notify me form | Email capture form shown for out-of-stock products. |
| Countdown timer | A countdown, useful for limited-time offers. |
| Pre-order notice | A message for products available for pre-order. |
| Enquiry form | A contact form for customers to ask questions about the product. |
| Bundle contents | Lists the items included in a bundled product, with an option to add them all to cart together. See below. |
| Selling plans | Subscription and purchase-option selector, see below. |
| Pickup availability | In-store stock lookup, see below. |
| Urgency indicators | Low-stock or high-demand messaging. |
| Upsell products | A small set of upsell products shown alongside the main product. |
| Alert | A metafield-driven banner (info, warning, or similar style) inside the info column, useful for shipping delays or ingredient/allergen notices sourced from a product metafield. |
| Download button | A button linking to a file, such as a size guide PDF, spec sheet, or assembly instructions. |
| Spec table | A configurable label/value table (up to 8 rows) for technical specifications, dimensions, or materials. |
| Personalization field | A custom text input (with a character limit and optional required toggle) for engraving, initials, or gift messages, added as a line item property. |
| Trust badges | A row of up to 4 icon + text badges, such as secure checkout, free shipping, easy returns, or a warranty callout. |
| Pop-up button | A button that opens a modal with custom rich-text content, commonly used for a size guide or a details popup. |
| Notification message | A dismissible inline message block for one-off announcements specific to this product. |
| @app | Reserves a slot for any Shopify app block that adds itself to the product page. |
Bundle contents
The Bundle contents block lists other products alongside the current one, useful for showing everything included in a curated set. It reads products from tags on the current product formatted bundle:product-handle (one tag per included item), or falls back to a plain comma-separated list of text lines if you'd rather describe the contents without linking real products.
Turn on Add all bundle items to cart together in the block's settings to make the buy button add the current product and every tag-linked item as separate cart lines in one click, each keeping its own price. This only applies to items linked via bundle: tags, since the plain text fallback has no real product to add. Leave it off if you'd rather the block work as a "what's included" reference only, with each item clickable through to its own product page.
With this setting on, each linked item shows its own checkbox next to it, checked by default. A customer who only wants the main product, or only some of the linked items, can uncheck the rest before adding to cart, so the bundle is a convenience rather than a forced purchase.
For example, to sell a "Brightening Duo" set built around a serum, tag the serum's product page with bundle:hyaluronic-acid-2-booster and bundle:spf-50-mineral-daily-moisturiser, one tag per included product. Use each product's handle, the part of its URL after /products/ in Shopify admin, not its display title. Add the Bundle contents block to the product, and both items appear in the list automatically, no need to touch the block's own settings for each product.
Tip: A bundle tag only needs to exist on the main product being viewed, not on the items it links to. Those linked products don't need any tag of their own and can also be sold on their own product pages as normal.
Selling plans and subscriptions
When a product has selling plans configured in Shopify admin, the Selling plans block lets customers choose between a one-time purchase and a subscription, with pricing for each option shown inline. Add the block wherever you want the purchase-option choice to sit relative to the variant picker and buy buttons. Products with Shop Pay Installments enabled show the installment breakdown near the price automatically, no extra block is required.
Pickup availability
The Pickup availability block shows real-time stock at your local pickup locations, using Shopify's local pickup feature. Customers can see which store has the item in stock without leaving the product page. This only appears for products and locations that have local pickup enabled in Shopify admin.
Accelerated checkout
The Buy buttons block includes accelerated checkout options such as Shop Pay, PayPal, and Apple Pay/Google Pay where available, shown beneath the standard Add to cart button. These are controlled by your payment provider settings in Shopify admin, not by theme settings.
Gift card products
When the product is set as a gift card in Shopify admin, the buy box automatically shows recipient form fields, name, email, and a personal message, so the gift card can be sent directly to the recipient at checkout.
Tip: Add the Accordion block once and use its own nested items for shipping, returns, and sizing content instead of adding three separate blocks. It keeps the info column shorter and easier to reorder later.