# Product list

> A data-driven catalog you edit from a panel — add, reorder, and update items without an AI request.

Source: https://knowledge.estage.com/commerce/product-list/
Part of the ESTAGE knowledge base (https://knowledge.estage.com). Full corpus: https://knowledge.estage.com/llms-full.txt

---
A **product list** builds a catalog the right way: your items live as **data**, the grid renders
them, and you edit them from a panel in the visual editor — no AI turn for every price change.

It's not just for shops — services, rentals, listings, menus and portfolios all fit. Nobody can
buy from it, though: it's a display catalog. For a real storefront with a cart and checkout, see
the [Store](/store/).

## How to trigger it

- Type `/` in the composer and pick **Product List**. It drops a starting prompt —
  *"[product list: describe your catalog …]"* — for you to fill in and send.
- Or describe it: *"add an editable product catalog — a flower shop with 8 bouquets, each with a
  photo, name, and price"*.

Say what each card should show (photo, name, price, description, a link…) and how many items to
start with. The more specific the request, the closer the first version.

## What gets built

- A **product grid section** on your page, styled to your theme.
- The items, stored as an editable data list, seeded with starting content — with generated,
  on-theme photos unless you give your own.
- A **catalog panel** in the visual editor, wired to that list.

## Editing products afterward — no chat needed

Click the grid in the preview and the catalog panel opens in the element panel:

- **+ Add** an item, **Duplicate** or **Delete** one, and drag items to reorder.
- Edit any field in place. Image fields take a URL, a pick from your project **Library**, or an
  **Upload**.
- Changes save as you go (the panel shows *Saving…* then *Saved*) and appear in the preview right
  away.

## Restyling and changing fields

Ask the AI to restyle the *look* freely (*"make the cards horizontal with a shadow"*) — the data
stays as it is. Changing the **fields** themselves — adding a new field to every card, or
renaming one — needs an AI request rather than the panel.

:::tip
Ask for an *editable* catalog. A plain "add a product section" may get you hard-coded cards —
pretty, but every product change becomes an AI request. The word *editable* (or the slash entry)
is what gets you the catalog panel. You can also make an existing section editable later with
the **Live Controls** slash entry.
:::