Skip to content

Product list

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.

  • 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.

  • 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

Section titled “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.

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.