# Producten

Producten vormen de kern van je winkelcatalogus. Vanuit het beheerdersdashboard kun je producten aanmaken, bewerken en organiseren — elk met een eigen titel, beschrijving, prijzen, afbeeldingen en aangepaste kenmerken. Alles wat je hier configureert wordt weergegeven in de klantzijde van de winkel.

## Door je producten bladeren

Open **Products** in de zijbalk van het beheerdersdashboard om de volledige productlijst te bekijken. De tabel toont de titel, slug, SKU, status, prijs en voorraad van elk product.

![Productenlijst](/features/products/products-list.png)

| Kolom  | Beschrijving                                        |
| ------ | --------------------------------------------------- |
| Title  | Productnaam met thumbnail (klik om te bewerken)     |
| Slug   | URL-pad dat in de winkel wordt gebruikt             |
| SKU    | Voorraadeenheid voor inventarisbeheer               |
| Status | **Active** (zichtbaar voor klanten) of **Inactive** |
| Price  | Huidige verkoopprijs in de winkelvaluta             |
| Stock  | Beschikbare voorraad                                |

Je kunt **sorteren** door op een kolomkop te klikken en **zoeken** door te typen in de zoekbalk. Gebruik de knop **Filter** om te filteren op prijsklasse of status.

## Bulkacties

Selecteer een of meer producten met de selectievakjes aan de linkerkant en gebruik vervolgens de bulkactiebalk die onderaan verschijnt:

- **Activate** — maakt geselecteerde producten zichtbaar in de winkel
- **Deactivate** — verbergt geselecteerde producten voor klanten
- **Delete** — verwijdert geselecteerde producten permanent (een bevestigingsdialoog verschijnt)

## Een product aanmaken

Klik op **New Product** op de productlijstpagina om het aanmaakformulier te openen.

![Productaanmaakformulier](/features/products/create-product-top.png)

### Productdetails

| Veld              | Verplicht | Beschrijving                                                                                                |
| ----------------- | --------- | ----------------------------------------------------------------------------------------------------------- |
| Title             | Ja        | De productnaam die aan klanten wordt getoond. Genereert automatisch een URL-slug.                           |
| Slug              | Ja        | URL-vriendelijke identificatie (kleine letters met koppeltekens). Automatisch gegenereerd, maar bewerkbaar. |
| Short Description | Nee       | Korte samenvatting op productkaarten in collecties en zoekresultaten.                                       |
| Description       | Ja        | Volledige productbeschrijving op de productdetailpagina. Kan met AI worden gegenereerd indien ingeschakeld. |
| Base Price        | Ja        | Huidige verkoopprijs (zonder btw). Wordt prominent weergegeven in de winkel, herberekend met btw voor B2C-weergave. |
| Show Previous Price Reduction | Nee | Optie om een prijsverlaging te tonen. De doorgehaalde prijs in de winkel gebruikt de laagste prijs van de afgelopen 30 dagen, conform de EU Omnibus-richtlijn (zie [Prijsverlagingen](#prijsverlagingen-eu-omnibus-richtlijn) hieronder). |
| Measure Value & Measure Unit | Nee | Optioneel paar velden voor [prijs per eenheid](#prijs-per-eenheid) (bijv. €/kg, €/L). Beide velden moeten samen worden ingevuld. |
| Stock             | Ja        | Beschikbare voorraad. Bij nul wordt de knop **Add to Basket** vervangen door **Out of Stock**.              |
| SKU               | Nee       | Voorraadeenheid voor intern inventarisbeheer. Moet uniek zijn indien opgegeven.                             |
| Collection        | Nee       | Wijs het product toe aan een collectie (categorie). Beïnvloedt de breadcrumbnavigatie in de winkel.         |
| Tax Rule          | Nee       | Belastingberekeningsregel. Wordt automatisch ingesteld op de standaardregel indien aanwezig.                |
| Active            | Nee       | Bepaalt de zichtbaarheid in de winkel. Producten zijn standaard inactief.                                   |

> **Tip:** Als je winkel AI-integraties heeft ingeschakeld, kun je op de AI-genereerknop naast het veld Description klikken om automatisch een productbeschrijving te maken op basis van de titel.

### Belastingvoorbeeld op het formulier

Onder het veld Base Price toont het formulier de **price with tax** die de klant zal zien (winkelprijzen zijn altijd inclusief btw voor B2C-conformiteit in de EU). Wanneer de toegewezen belastingregel land-specifieke afwijkingen heeft, opent een knop **View per-country prices** een uitsplitsing van de uiteindelijke prijs die elk land berekend krijgt, zodat je de waarden kunt controleren voordat je opslaat.

### Kenmerken

Kenmerken zijn aangepaste sleutel-waarde attributen die je product beschrijven (bijv. Materiaal, Maat, Kleur). Klik op **Add Characteristic** om een nieuwe rij toe te voegen.

![Product aanmaken — kenmerken en media](/features/products/create-product-bottom.png)

- **Key** — selecteer een bestaande sleutel of typ een nieuwe om deze aan te maken
- **Value** — vrije tekst (bijv. "100% Biologisch Katoen", "Groot", "Rood")

Je kunt zoveel kenmerken toevoegen als nodig. Ze verschijnen in een inklapbaar **Product Characteristics** accordion in de winkel.

### Media

Upload productafbeeldingen en video's via het uploadgebied. Je kunt meerdere bestanden tegelijk uploaden.

- De **eerste afbeelding** wordt gebruikt als productminiatuur in de lijst en op productkaarten
- Afbeeldingen verschijnen in een **carrousel** op de productdetailpagina, in de volgorde van uploaden

## Een product bewerken

Klik op een producttitel in de lijst (of op de bewerkactie in het rijmenu) om het bewerkformulier te openen. Het bevat dezelfde velden als het aanmaakformulier, vooraf ingevuld met de huidige productgegevens.

![Product bewerken](/features/products/edit-product.png)

Klik op **Save Changes** als je klaar bent. Je kunt het product ook verwijderen vanuit de gevarenzone-sectie onderaan de bewerkpagina.

## Hoe producten in de winkel worden weergegeven

Elk veld dat je configureert in het beheerdersdashboard correspondeert met een specifiek element op de klantgerichte productpagina.

![Productpagina in de winkel](/features/products/storefront-product.png)

| Beheerveld        | Weergave in de winkel                                                                              |
| ----------------- | -------------------------------------------------------------------------------------------------- |
| Title             | Grote kop bovenaan de pagina en in het breadcrumbpad                                               |
| Description       | Tekstparagraaf onder de toevoegen-aan-winkelwagen-knop                                             |
| Short Description | Ondertitel op productkaarten (collecties, zoekresultaten, startpagina)                             |
| Base Price        | Huidige prijs prominent weergegeven, altijd inclusief btw                                          |
| Show Previous Price Reduction | Wanneer ingeschakeld en de huidige prijs onder het 30-daagse minimum ligt, wordt het 30-daagse minimum doorgestreept naast de huidige prijs getoond (rode aanbiedingsstijl) |
| Measure Value / Unit | Toont een regel "per kg" / "per L" / etc. onder de prijs op kaarten, productpagina, collectie en zoekresultaten |
| Stock > 0         | Knop **Add to Basket** is ingeschakeld                                                             |
| Stock = 0         | Knop verandert naar **Out of Stock** en is uitgeschakeld                                           |
| Active            | Alleen actieve producten zijn zichtbaar voor klanten                                               |
| Media             | Afbeeldingscarrousel met zijbalkminiaturen (desktop) en veegcarrousel (mobiel), plus zoom-lightbox |
| Collection        | Verschijnt in de breadcrumb (Home > Collectie > Product) en als merklabel boven de titel           |
| Characteristics   | Inklapbaar **Product Characteristics** accordion met sleutel-waarde lijst                          |
| Slug              | Bepaalt de product-URL (bijv. `/product/organic-cotton-t-shirt`)                                   |

### Prijsverlagingen (EU Omnibus-richtlijn)

Capyshop volgt de EU Omnibus-richtlijn voor prijsverlagingen. Om een aanbieding aan te kondigen, verlaag je de **Base Price** van het product onder wat het de afgelopen 30 dagen is geweest en schakel je **Show Previous Price Reduction** in. De winkel zal vervolgens de **laagste prijs van de afgelopen 30 dagen** doorhalen (niet een handmatig ingevoerd bedrag) — dat is de wettelijk verplichte referentieprijs.

Het formulier geeft realtime feedback terwijl je bewerkt:

- **Verlaging wordt getoond** — het formulier bevestigt het doorhalen dat de klant zal zien, bijv. "Customers will see €18.00 with €24.00 struck through (the 30-day lowest price)".
- **Geen verlaging wordt getoond** — als de huidige Base Price niet onder het 30-daagse minimum ligt, waarschuwt het formulier dat er geen aanbiedingsbadge zal verschijnen, zelfs met de schakelaar aan.

Prijswijzigingen worden automatisch geregistreerd elke keer dat een product of variant wordt opgeslagen. Een wekelijkse opruimtaak verwijdert geschiedenis ouder dan 90 dagen, zodat de opslag beperkt blijft terwijl het 30-daagse venster intact blijft.

### Prijs per eenheid

Prijs per eenheid toont klanten een genormaliseerd tarief "per kg" / "per L" / "per m" / "per m²" onder de prijs op kaarten, productpagina, collectie en zoekresultaten. Het is verplicht volgens EU-regels voor veel productcategorieën en wordt ook geëxporteerd naar de [Google Merchant Center-feed](https://support.google.com/merchants/answer/6324509) als `unit_pricing_measure` en `unit_pricing_base_measure`.

Stel zowel **Measure Value** als **Measure Unit** in op het product:

- **Measure Value** — de meetbare hoeveelheid van het product (bijv. `750`).
- **Measure Unit** — de meeteenheid (kg, g, L, ml, m, cm, m²).

Capyshop converteert naar de juiste basiseenheid (kg, L, m, m²) bij het tonen van het tarief per eenheid. Producten die per stuk worden verkocht — telbare producten — zijn vrijgesteld van prijs per eenheid volgens de richtlijn en moeten deze velden leeg laten.

### Mobiele ervaring

Op mobiele apparaten past de productpagina zich aan met een carrousel op volledige breedte (met veegnavigatie en voortgangsbalk) en een **vaste Add to Basket knop** onderaan het scherm voor gemakkelijke toegang tijdens het scrollen.

![Product in de winkel op mobiel](/features/products/storefront-product-mobile.png)

## Machine-leesbare pagina's voor LLMs

Elke productpagina heeft een `.md` versie die pure markdown retourneert, ontworpen voor AI-tools en LLMs om gemakkelijk te verwerken:

- `/product/{slug}.md` — volledige productdetails inclusief beschrijving, prijs, voorraad, kenmerken en afbeeldingen

Deze endpoints retourneren `text/markdown` inhoud met absolute URLs voor afbeeldingen en links.