Reference

Shop

Products for your sales

This set of blueprint samples is for a simple shop setup, with a shop overview page that lists all products in pages section and the single product pages with a cover image blueprint.

Shop overview

/site/blueprints/pages/shop.yml
title: Shop
preset: pages

icon: 🛍

options:
  status: false

drafts:
  extends: sections/products
  headline: Unpublished Products

listed:
  extends: sections/products
  headline: Published Products
  layout: cards

Reusable products section

/site/blueprints/sections/products.yml
type: pages
headline: Products
parent: site.find("shop")
template: product
info: "€ {{ page.price }} / {{ page.design }}"
image:
  src: page.image
  ratio: 1/1
  back: pattern

Result

Single product

/site/blueprints/pages/product.yml
title: Product
preset: page
num: zero

status:
  draft: true
  listed: true

fields:
  price:
    type: number
    step: 0.01
    before: €
  design:
    label: Design by …
    type: text
  sizes:
    type: checkboxes
    default:
      - S
      - M
      - L
      - XL
      - XXL
    options:
      - S
      - M
      - L
      - XL
      - XXL
  link:
    type: url
  description:
    type: textarea

sidebar:
  image:
    extends: sections/image
    template: cover
    min: 1
    image:
      ratio: 1/1

Reusable image section

/site/blueprints/sections/image.yml
type: files
headline: Product Image
max: 1
layout: cards
info: "{{ file.dimensions }}"

Result