Sulu Product Bundle

From the Sulu skeleton to a product overview, and beyond

github.com/sulu/SuluProductBundle
Daniel Mathis · Full Stack Developer · github.com/Prokyonn

QR code: github.com/sulu/sulu-touch-2026-product
The idea

A product is Sulu content.

  • Like a page or an article
    • SEO/Excerpt, URL, preview
    • Draft, publish, versions, workflow
  • Plus product logic
    • Families, attributes, variants, associations
  • Not a shop system
    • A flexible presentation layer for your products
  • Three types: product, product with variants, variant
The idea

One product, many variants.

  • Product: the shared facts, like title, family, material
  • Variant: own colour, size, picture and URL
  • One URL per product: coming soon

Under the hood

The entity model.

Entity diagram of the product bundle
Describing products

Groups, attributes, families.

Attribute group

  • Look, Material & care, Specs, Good to know
  • One block in the admin form and on the website

Attribute

  • One fact with a type
  • Colour, weight, release date
  • Filterable on request

Product family

  • Clothing
  • Per attribute: required or variant
  • Set per family

The family decides the form. Required can differ per family. On the page the variant's value wins.

Describing products

Five types of attributes.

Text

Hello, World!
Print motif, fun fact. Translatable.

Number

180 g 40 °C 330 ml
Units from 17 measurement families.

Date

2 March 2026
Release date, in your format.

Options

Organic cotton
One value from a fixed list.

Boolean

Yes
Dishwasher safe, limited edition.

Coming soon

Range, multiple selection and more.

Filterable attributes become filters in the search.

The plan

Today, in a fresh skeleton.

Install and import

The bundle, the catalogue as data, a console import.

Product page

Tailwind frontend, attributes, related products.

Variants

Colour and size, each with its own URL.

A catalogue page with filters and SEAL search.

AI

An AI client manages products through MCP. Symfony AI tools come with the bundle.

Review

Products need a review before they go live.

Nine steps. One branch per step. Every step starts from the one before.

Live Coding

One pull request per step, from the empty skeleton to the finished shop.

github.com/sulu/sulu-touch-2026-product

QR code: github.com/sulu/sulu-touch-2026-product
Open Demo

Thank you. Questions?

github.com/sulu/sulu-touch-2026-product · github.com/sulu/SuluProductBundle

QR code: github.com/sulu/sulu-touch-2026-product

Time: 0:30 - Hello and welcome - Daniel, Full Stack Developer - A few slides, then live code - We build a small Sulu merchandise shop: T-shirts, mugs, stickers - The repo is public: QR code, one pull request per step; the bundle link below it - If I break it: one branch per step, `git checkout` is my undo Cue: stay on the title. Do not read the subtitle.

Time: 1:30 - Products are content, like a page or an article - Same tabs: SEO/Excerpt, URL, preview - Same lifecycle: draft, publish, versions, workflow - Plus product logic: families, attributes, variants, associations - Not a shop system: a flexible presentation layer for your products - Three types: product, product with variants, variant Cue: count the three types on your fingers.

Time: 1:00 - Example: a T-shirt - Product: shared facts, title, family, material - Variant: colour, size, own picture, own URL - Today the variant has the URL - Coming: one URL per product, variant by query parameter or not at all, per project Cue: point at the shirt tag on the left, then at the cards on the right.

Time: 1:30 - Product: only the identity (uuid, type, parent) - A variant points to its parent - DimensionContent: everything editors write, one per stage and locale - Draft, published, versioned: the same design as pages and articles - Values, family and associations hang on the content - Family and attributes: next slide Cue: left box, then the dark box, then down. Say "one to n" on the first line.

Time: 0:45 - Attribute: one fact with a type (colour, weight, release date) - Group: one block in the admin form and on the website, no logic - Ours: Look, Material & care, Specs, Good to know - Family: which attributes a product has - Per family: required, variant - Weight: required for clothing, optional for accessories - On the page the variant's value wins - Filterable is set on the attribute: becomes a search filter Cue: if short on time, skip the group.

Time: 0:45 - Text: print motif, fun fact, translatable - Number: with a unit, 17 measurement families (weight, temperature, volume, ...), the config picks the units - Date: release date, your format - Options: fixed list, one value, so colour and size are two attributes - Boolean: new, limited edition, dishwasher safe - Coming soon: range, multiple selection Cue: one card per breath. Say "new" at boolean.

Time: 1:00 - Fresh Sulu skeleton, nothing installed - Install, catalogue as data, console import - Product page with attributes and related products - Variants: colour and size, own URL - Catalogue page with filters and search - AI: an MCP client manages products; Symfony AI tools only mentioned - Review before going live Cue: touch each card in reading order.

Time: 0:30 - From now on only code - One pull request per step: follow along with the QR code - Step 1: install the bundle Cue: switch to the editor, branch `step-00-skeleton`. Typing fails: `git checkout -f step-NN-...`.

Time: Q&A - Thank you - QR code: the repo with one pull request per step; the bundle link below the title - Questions Cue: leave this slide up during Q&A.