Skip to content

Set up a product page in Guild ​

Documentation scope: Guild 0.1.x pre-release builds. The exact public release version will be confirmed in the changelog before Theme Store publication.

Use this guide to turn the default Product template into a working product page. Start with real product data, then arrange Guild's Product blocks. For detailed appearance settings, see Templates and the Sections catalog.

1. Prepare one real product in Shopify ​

  1. In Shopify Admin, open Products and choose a representative product.
  2. Add a title, description, images, prices, available variants, and appropriate inventory data. Publish the product to the Online Store.
  3. If the product needs material, care, or delivery information that varies by product, prepare metafields and dynamic sources before editing the display.
  4. Keep another test product with different variants or missing optional data available for comparison.

A Theme Editor placeholder is only a design preview; it does not supply missing product data on the storefront.

2. Open the Product template ​

  1. Go to Online Store > Themes and open the Guild theme editor. Work in an unpublished copy when making substantial changes.
  2. Choose Products > Default product from the page selector (or select the product template that you intend to edit).
  3. Change the preview resource to your prepared product. The selected product changes what you see while editing; it does not assign a template to all products.
  4. Open the main Product section. The default template contains a nested Product composition; you can also use Product spotlight as a separate section with a selected product on other page types.

For creating and assigning additional product templates, use Shopify's template instructions.

3. Find the blocks that own each part ​

What you want to changeWhere to start
Main images and thumbnailsProduct gallery
Product title, price, descriptionThe matching Product title, Product price, and Product description blocks
Color/size selectionProduct variants
Quantity and Add to cartPurchase controls / product-form composition
Stock messageProduct inventory (not the quantity input)
Materials, specifications, care detailsProduct metafields, Product-specific accordion/tabs, or a compatible dynamic source
Delivery copy by variantProduct shipping with Show advanced options > Update by variant
Matching productsProduct list with Related products or Complementary products source

Product Row, Column, Box, Accordion, Tabs, and Product visibility group blocks are layout and conditional wrappers. Expand their nested children in the editor to reach the block that actually renders the content. Product-specific wrappers preserve the current product context. Do not assume that a generic block supports the same Product-specific children.

For detailed nested-block behavior, use the Product spotlight reference. A screenshot of the nested block tree can be added after final live editor verification; the steps above do not depend on a screenshot.

4. Add product-specific content without duplicating templates ​

For data that differs between products, prefer Shopify product metafields over writing a separate copy into each product template. Set values in Shopify Admin, then connect a compatible setting via Connect dynamic source, or use Guild's dedicated Product metafield blocks where appropriate.

To display care instructions only for products with the relevant data, use a Product-specific Accordion item - product, Tab - product, or Product visibility group and choose Show content when > Product metafield has a value with the correct namespace/key. For the complete setup, see Use metafields and dynamic sources.

5. Test purchase states before publishing ​

  • Check a single-variant product and one with multiple option values, including unavailable variants.
  • Change variants and confirm media, price, available options, Product shipping, and inventory behave as expected.
  • Test Add to cart, quantity rules, sold-out behavior, and relevant accelerated payment buttons in a real storefront preview.
  • Check narrow mobile layouts, long titles, rich descriptions, focus order, and keyboard controls.
  • If using Quick view, test both the dialog and the intentional full-product-page fallback.
  • If using Shopify XR, provide a 3D model and test on a supported device; an editor preview is not proof of device support.

If the page is empty or behaves differently ​

Start with Why content is missing for Shopify data, template context, and visibility checks. For variant-specific delivery or purchase errors, use Troubleshooting or Contact support. You can contact support without completing every diagnostic step.

Next: Set up metafields and dynamic sources, then Collection and search filters.

Merchant documentation for the Guild Shopify theme.