The Joinery guide · Version 1.0.0

Make room for your own story.

Set up Joinery’s material-led storefront, help customers choose a finish, and bring your products into the spaces they belong.

Getting started

  1. Open Shopify admin → Online Store → Themes. Add Joinery to your theme library, then choose Customize.
  2. Choose the Joinery preset. Add your logo, colors, fonts, products, collections, and navigation.
  3. Replace the theme’s onboarding placeholders with your own images and copy. Demo product photographs and store data are not included with a theme installation.
  4. Preview on a phone and desktop. Check a product with every option, add it to the cart, and verify checkout using your store’s test-payment setup.
  5. Publish when you are ready. Keep a duplicate of your previous theme as a backup.

Joinery works by itself. No companion app or recurring app subscription is required for the features described in this guide.

Brand and navigation

Under Theme settings → Brand, set Logo, Logo width, and Favicon. The Header’s Text logo is used when no logo image is selected; otherwise your store name is the fallback.

Typography provides Body font and Heading font. Colors controls Background, Text, Surface, Surface text, Button background, Button text, and Borders. Keep readable contrast when changing these. Layout includes Corner radius and Use cart drawer.

Build menus in Shopify’s Content → Menus area, then select Main menu in Header and Footer menu in Footer. Joinery supports three navigation levels. Set the Header’s Announcement and Small caption, or leave either empty. Add Instagram and Pinterest URLs in Theme settings → Social media.

Homepage and room stories

Room story

Choose a Room image, Heading, Body text, Button label and Button link. A wide, high-resolution room photograph works best; set its focal point in Shopify so the important subject remains visible on smaller screens. The Image caption appears over the photograph. Leave the button link empty to hide the action.

Featured collection

Select a Collection and Products to show. Product cards use Shopify’s product images, type, price, availability, and links. Use consistent image framing for a calm, ordered grid.

Materials and craft

Add an Image and describe the decisions behind your product. Craft detail blocks each contain Heading and Body text. Reorder or remove them in the theme editor. Button label and Button link can point to a material or care page.

Shop the room

Select a Room image. Add up to five Product hotspot blocks, choose the Product for each, and use Horizontal position and Vertical position to place the marker. Each marker opens a product link; the same products also appear in a keyboard-accessible list below the image.

The product configurator

Product information comes from Shopify admin → Products. Add option names such as Wood finish or Upholstery, create the variants, and assign variant images and prices. Joinery updates the image, price, availability, lead time, and purchase form when a shopper changes an option.

For visual swatches, configure Shopify’s category-linked Color or material options and their native swatch data. If no swatch data exists, Joinery displays readable option names. Product options are loaded through Shopify’s section rendering, rather than assuming all variants fit in a single browser payload.

The Product section is block based. Reorder title, price, description, options, lead time, buy buttons, samples, dimensions, and Custom Liquid. The Featured product section supports product and app blocks too. Keep the essential option and purchase blocks present.

Use descriptive alternative text on product media. Shopify-hosted video, external video, and 3D models use Shopify’s media controls. Add related or complementary items with the Product recommendations section and Shopify’s recommendation settings.

Samples, lead times, and dimensions

Material samples

Create a normal product for your sample set, set its price, shipping, and inventory rules, then choose it in the product’s sample block. The link opens that sample product. “Free” means your sample product is priced at zero; shipping or taxes still follow your store settings. The theme does not automatically create sample products, refund purchases, or remove shipping charges.

Lead time per variant

  1. In Shopify Settings → Custom data → Variants, add a Single line text definition with namespace and key joinery.lead_time.
  2. Open each product variant and fill its lead time, for example “Made to order · dispatch in 4–6 weeks.”
  3. Keep the lead-time block in your Product section. Its fallback text is used when a variant has no value.

This is a display message. It does not schedule fulfillment or change checkout delivery dates.

Dimensions and fit

Use the dimensions block’s text and optional diagram image to explain measurements, doorway clearance, and placement. Connect a product metafield as a dynamic source where Shopify offers that control. Add useful alternative text to diagrams. The theme does not calculate room dimensions or generate diagrams.

Collections and search

Create collections in Shopify and choose products. On the Collection template, use Products per page to set the grid length. Shopify’s native filters and sorting appear on collection and search pages; configure available filters in Shopify Search & Discovery where applicable. Filter availability depends on Shopify and your catalog data.

Header search supports predictive results and a full results page. Set product titles, descriptions, image alternative text, and SEO fields in Shopify. Keep storefront languages and markets configured in Shopify; country and language selectors appear when more than one option is available.

Cart and app compatibility

Enable Use cart drawer for a slide-out cart, or turn it off to use the cart page. Customers can change quantities, remove items, add order notes, and continue to checkout. Discounts, selling plans, unit prices, and accelerated checkout are displayed when Shopify makes them available for that cart and market.

Add compatible app blocks in the theme editor. Joinery also provides Custom Liquid blocks and sections. An app may require its own subscription and setup; app fees are separate from the theme price. Joinery does not include invoicing, priced add-ons, delivery-rule automation, or accounting services.

For developers: Joinery exposes the Starter Pack Suite styling variables and cart events, while remaining independent of that app. Installing an app is optional and its availability must be checked separately.

Pages, forms, and accessibility

Make pages in Shopify and assign the default page template. Assign page.contact to a page for your store’s customer-contact form; Shopify routes those messages according to your store configuration. Blog and article templates support article content and comments. The password page and gift-card page use your brand settings.

Footer newsletter signup uses Shopify’s customer form. Only enable it if you are ready to handle marketing consent and subscriber communications. Add your store policies in Shopify Settings → Policies.

Joinery includes visible keyboard focus, a skip link, labeled controls, semantic headings, reduced-motion support, and text alternatives for visual selectors. Your content and color choices can affect accessibility. Test keyboard navigation and mobile layouts after adding content or apps.

Frequently asked questions

Why does the installed theme look different from the demo?

The preset provides the same layout, colors, and typography. Demo photographs, products, collections, and menus belong to the demo store, so you need to select your own content.

Why is my variant lead time missing?

Check that the definition belongs to Variants, uses Single line text, and has the exact key joinery.lead_time. Fill the value on the selected variant and keep the lead-time block enabled.

Do material choices automatically add a price?

Native variant prices are displayed and charged by Shopify. Arbitrary priced add-ons require a separately configured app; a theme alone does not create those charges.

Why are pickup, installments, or accelerated checkout missing?

These depend on your Shopify payment, inventory, location, market, and eligibility settings. The theme shows them when Shopify supplies them.

Can I use a different cart app?

App compatibility depends on the app. Try it on an unpublished duplicate first. Avoid running two cart drawers at the same time. Contact us with the app name and the steps that reproduce a problem.

Support and updates

We help with Joinery setup questions and defects in the theme. We reply within two business days and prioritize critical bugs immediately. Theme support does not include custom design work, third-party app development, or changes to Shopify’s checkout platform.

Before updating or editing code, duplicate your theme. Apply an available update from Shopify’s theme library, review any custom code, and test your storefront before publishing it. Custom code may need to be reapplied by its author.

Open the Joinery support form or email operations@steelyardventures.com. Include your store URL, the affected page, and steps to reproduce the issue. Do not send passwords, payment details, or customer records.

Release notes

1.0.0 · November 7, 2026: Initial Joinery release candidate with material-led product selection, variant lead-time display, samples, room hotspots, native filters, and a cart drawer. Theme Store approval and public availability are separate from this documentation release.