Tenon

A made-to-order Shopify theme for furniture, home, leather, and configured products.
Version 0.1.0 · Shopify Online Store 2.0 · Liquid, JSON templates, native CSS/JS


1. Purpose

Tenon is built for products that are configured, built, and delivered over time. It makes material choice, dimensions, lead time, samples, personalisation, and trade purchasing part of the product page instead of hiding them in tabs.

The theme is aimed at furniture makers, home brands, leather goods studios, jewellers, and custom-gift merchants with 2–6 configurable options and lead times from two to sixteen weeks.

2. What is included

  • Complete Online Store 2.0 theme.
  • Full-bleed material hero with material chips.
  • Shop-the-room section with shoppable hotspots.
  • Craft-process timeline and material library.
  • Lead-time promise with production stages.
  • Sample-kit path and trade programme.
  • Product page with gallery, configurator, lead time, dimensions, samples, trade, care, and personalisation.
  • Collection page with material/room filters and lead-time labels on cards.
  • Predictive search, cart drawer, cart page, account component, gift card, password, 404, blog, article, and contact templates.
  • Theme editor settings for colours, typography, layout, materials, lead time, samples, and trade.
  • Licensed Shopify Burst photography and vector fallbacks in demo/.

3. Requirements

  • Shopify store with the Online Store channel.
  • Shopify CLI 4.x or admin theme upload.
  • Optional: product metafields for lead time, dimensions, care, and complementary products.
  • Optional: a sample-kit product and a trade contact page.

4. Installation

npx shopify theme dev --store your-store.myshopify.com --path themes/tenon
npx shopify theme push --store your-store.myshopify.com --path themes/tenon --unpublished

Or upload a ZIP of themes/tenon in Online Store → Themes → Add theme → Upload ZIP file.

5. Configuration

Theme editor

  • Colors — bone, charcoal, terracotta, olive, stone.
  • Typography — Archivo headings, Libre Baskerville body.
  • Layout — page width, spacing, square corners.
  • Footer — brand statement, trade text/link.
  • Product — materials heading, sample product, default lead time, pickup/payment settings.

Metafields

The theme degrades gracefully without metafields. Recommended definitions:

Metafield Type Used by
custom.lead_time Single-line text Product page lead time, product card
custom.dimensions Rich text Product page dimensions block
custom.care Rich text Product page care block
custom.material Single-line text Optional material label
custom.complementary_products List of product references Complementary products

Create the definitions in Settings → Custom data → Products. Assign values per product.

Personalisation

Use Shopify's native line-item properties on the product variant, or add a product options app. The product form supports native options and variant selection. If you add personalisation fields through a Custom Liquid block, use properties[...] names so they appear in the cart and order.

Trade programme

  1. Create a page for trade enquiries (for example, pages/trade).
  2. Set the Trade programme block link to that page.
  3. Alternatively, use a contact form with a "Trade" tag.

Sample kit

  1. Create a product called "Material sample kit" with a low price and no shipping or with a sample shipping profile.
  2. Set it in the product section's Sample kit product setting.
  3. Link the sample kit from the homepage and product page.

6. Customisation

  • assets/theme.css — Tenon art direction: material hero, room hotspots, craft timeline, material library, lead time, trade.
  • assets/theme.js — touch-friendly hotspot behaviour; shared motion lives in assets/base.js.
  • sections/hero-material.liquid, shop-the-room.liquid, craft-process.liquid, material-library.liquid, lead-time-promise.liquid, trade-program.liquid.
  • snippets/product-form.liquid — shared purchase form.
  • snippets/product-card.liquid — landscape card with material/lead-time metadata.
  • locales/en.default.json — storefront strings.

7. Validation status

  • shopify theme check: 0 errors, 0 warnings at the time of writing.
  • Structural validator passes required templates, sections, JSON, and account/localization checks.
  • Live-store installation, home/product/collection/cart/search, add-to-cart, and Lighthouse home-page audits were executed on the branded demo stores. Checkout, app-dependent flows, and template-level Lighthouse runs remain unmeasured. See docs/05-validation-report.md.

8. Known limitations

  • Lead time, dimensions, and care depend on the merchant's metafields. The theme hides empty blocks rather than inventing data.
  • Production tracking, trade pricing, and personalisation validation may require apps or Shopify Plus features.
  • The demo photography is licensed from Shopify Burst. The SVG illustrations remain available as offline fallbacks in demo/<theme>/images/.
  • The theme_info documentation/support URLs point to deivisoft.eu. Publish the documentation and support pages before submission.
  • One preset ships at launch. Additional presets require a /listings folder and separate demo stores.
  • Theme Store acceptance is not guaranteed.

9. Support and license

See LICENSE.md and the root THIRD_PARTY_NOTICES.md. No third-party JavaScript libraries or font files are bundled. Theme support covers bugs and documented configuration, not custom design or code.

FAQ

How do I install the theme?

Install the ZIP from the Theme Store or upload it under Online Store → Themes → Add theme → Upload ZIP file. Then publish or preview the theme.

Does the theme require apps?

No. The core experience uses native Shopify features. App blocks are available for optional integrations such as reviews, subscriptions, or wholesale pricing.

How do I get support?

Use the support form. Include your store URL, theme name, and a description of the issue. We reply within two business days.

How do updates work?

Theme Store purchases include updates. Download the latest version from the Theme Store or your Shopify admin and apply it to a duplicate of your theme before publishing.