# Wix Stores: De Studio Two Categoriepagina aanpassen

Source: https://support.wix.com/nl/article/wix-stores-customizing-the-studio-two-category-page-nl (updated 2026-11-13)
Related: Wix developer documentation, https://dev.wix.com/docs/llms.txt; Help Center index, https://support.wix.com/en/llms.txt

> **Belangrijk:** Om de beste ervaring te garanderen, brengen we langzaam functies uit in de Studio Two-editor. Als gevolg daarvan hebben sommige Wix Stores-widgets nog niet de volledige Studio Two-mogelijkheden.

Met de volledig aanpasbare Categoriepagina van Wix kun je je ontwerpvisie tot leven brengen. Begin met het vormgeven van de pagina op globaal niveau en ga dan afzonderlijk in op elk onderdeel totdat de pagina overeenkomt met je visie.

> **Tip:** Elke categorie gebruikt dezelfde pagina, dus bewerkingen worden over je hele webshop uitgevoerd. Nieuwsgierig hoe een andere categorie eruit zal zien met je ontwerp? Selecteer een andere categorie met behulp van de Voorbeeld-werkbalk boven de pagina.

---

## Stap 1 | Pas de algemene instellingen aan

Begin met de instellingen die van toepassing zijn op de hele pagina, zoals hoeveel producten deze toont, de opvulling, het ontwerp en de gegevens waarmee deze gekoppeld is.

### Om de algemene instellingen aan te passen:

1. [Ga naar je editor](https://manage.wix.com/account/site-selector/?actionUrl=https%3A%2F%2Fwww.wix.com%2Feditor%2F%7BmetaSiteId%7D%3FeditorSessionId%3D%7Besi%7D%26).
2. Klik op het **Websitestructuur**-pictogram ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/651c25b0-2d60-43c8-addf-1df2fd575568/2026/07/03/8fee07e0-2941-45dd-a732-3a3cc3343a50/afb13012-daf6-4a51-97bf-6ff135bbd545.png).
3. Klik op het **Pagina's**-tabblad.
4. Klik onder **Winkelpagina's** op **Categoriepagina**.
5. Kies wat je wilt aanpassen in de actiebalk:

**Categoriepagina beheren**

1. Klik op het **Gegevens-instellingen**-pictogram ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6583964-8756-4344-ae8a-f24ce7803d0f/2026/11/13/90a89992-df69-4d65-9d13-21d41bfc14a5/image.png).
2. Sleep de **Producten per pagina**-schuifregelaar of voer een getal in om te kiezen hoeveel producten op de pagina worden weergegeven.
3. (Optioneel) Klik op **Gegevens beheren** om je producten en categorieën op je dashboard toe te voegen en te beheren.

**Tip:** [Lees meer over het beheren van producten en categorieën](https://support.wix.com/nl/managing-products-and-categories)

**Opvulling & Gedrag**

1. Klik op het **Opvulling en gedrag**-pictogram ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6583964-8756-4344-ae8a-f24ce7803d0f/2026/11/02/85618892-5bd9-4167-8c60-7e72d8ef2c6f/image.png).
2. Voer de opvulling in die je voor de pagina wilt hebben.

**Alle ontwerpopties**

1. Klik op het **Alle ontwerpopties**-pictogram ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/59ab096e-e0a0-4b06-ad46-bd78e940c7f1/2026/07/22/375e5844-2445-425d-9084-d72e10b1ca22/image.png).
2. [Configureer je ontwerpopties in het Inspector-paneel.](https://support.wix.com/nl/article/studio-two-editor-working-with-the-inspector-panel#design)

**Aan data koppelen**

1. Klik met de rechtermuisknop op een element op de pagina.
2. Klik op **Aan data koppelen**.
3. [Koppel het element aan een gegevensbron.](https://support.wix.com/nl/article/studio-two-editor-about-data-sources)

---

## Stap 2 | Pas individuele elementen aan

Selecteer een element op de pagina om het in te stellen. Elk element heeft zijn eigen instellingen en ontwerpopties in het [Inspector-paneel](https://support.wix.com/nl/article/studio-two-editor-working-with-the-inspector-panel).

### Om een element aan te passen:

1. [Ga naar je editor](https://manage.wix.com/account/site-selector/?actionUrl=https%3A%2F%2Fwww.wix.com%2Feditor%2F%7BmetaSiteId%7D%3FeditorSessionId%3D%7Besi%7D%26).
2. Klik op het **Websitestructuur**-pictogram ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/651c25b0-2d60-43c8-addf-1df2fd575568/2026/07/03/8fee07e0-2941-45dd-a732-3a3cc3343a50/afb13012-daf6-4a51-97bf-6ff135bbd545.png).
3. Klik op het **Pagina's**-tabblad.
4. Klik onder **Winkelpagina's** op **Categoriepagina**.
5. Klik op het element dat je wilt aanpassen.
6. Kies wat je aan wilt passen:

**Breadcrumbs**

1. Selecteer de breadcrumbs op de pagina.
2. Klik in het Inspector-paneel op het **Instellingen**-tabblad.
3. Open **Toegankelijkheid** en voer een beschrijving in voor schermlezers in het **Toegankelijke naam**-veld.
4. (Optioneel) Klik op het **Ontwerp**-tabblad en selecteer **Breadcrumbs Categorie** of **Breadcrumbs** onder **Kies wat je wilt ontwerpen** om het hele element of alleen de breadcrumb-items op te maken.

**Categorienaam**

1. Selecteer de categorienaam op de pagina.
2. Klik op het **Ontwerp**-tabblad in het Inspector-paneel en pas de tekst aan in het **Typografie**-gedeelte, zoals het lettertype en de grootte.
3. (Optioneel) Klik op het **Instellingen**-tabblad om de gegevens te zien waaraan de tekst is gekoppeld.

**Categoriemenu**

1. Selecteer het categoriemenu op de pagina.
2. Klik in het Inspector-paneel op het **Instellingen**-tabblad.
3. Kies hoe het menu zich gedraagt:  
   * **Wanneer er geen subcategorieën zijn:** Selecteer **Categorieën met hetzelfde niveau tonen** of **Het categoriemenu verbergen**.  
   * **'Alles bekijken'-knop tonen:** Schakel dit in om een knop weer te geven die alle producten weergeeft.  
   * **Gedrag overloop:** Selecteer hoe het menu zich gedraagt wanneer de categorieën niet passen, zoals **Scrollen**.
4. (Optioneel) Klik op het **Ontwerp**-tabblad, selecteer **Categoriemenu** of **Menu-items** onder **Kies wat je wilt ontwerpen** en selecteer dan **Standaard**, **Aanwijzen** of **Geselecteerd** om die status op te maken.
5. (Optioneel) Klik in de actiebalk op **Indeling wijzigen** en selecteer **Horizontaal** of **Verticaal** in de **Oriëntatie**-dropdown.

**Filters-knop**

1. Selecteer de filters-knop op de pagina.
2. Klik in het Inspector-paneel op het **Instellingen**-tabblad.
3. Pas het filterpaneel aan:  
   * **Titel paneel:** Voer de titel in die bovenaan het filterpaneel verschijnt.  
   * **Paneel wordt geopend van:** Selecteer waar het filterpaneel wordt geopend, zoals **Links**.

**Productteller**

1. Selecteer de productteller op de pagina.
2. Klik op het **Ontwerp**-tabblad in het Inspector-paneel en pas de tekst aan in het **Typografie**-gedeelte, zoals het lettertype en de grootte.
3. (Optioneel) Klik op het **Instellingen**-tabblad, open **Toegankelijkheid** en voer een beschrijving voor schermlezers in het **Toegankelijke naam**-veld in.

**Toegepaste filters**

Toegepaste filters toont de filters die een klant heeft geselecteerd, samen met een **Alles wissen**-knop.

1. Selecteer de toegepaste filters op de pagina.
2. Klik in het Inspector-paneel op het **Ontwerp**-tabblad.
3. Selecteer **Toegepaste filters**, **Filtertag** of **Alles wissen** onder **Kies wat je wilt ontwerpen** om dat onderdeel op te maken.
4. (Optioneel) Klik op het **Instellingen**-tabblad, open **Toegankelijkheid** en voer een beschrijving voor schermlezers in het **Toegankelijke naam**-veld in.

**Sorteren**

1. Selecteer de Sorteren-dropdown op de pagina.
2. Klik in de actiebalk op **Pictogram aanpassen**.
3. Selecteer **Statisch** of **Geanimeerd** om het type pictogram te kiezen.
4. (Optioneel) Klik op **Vervangen** om een ander pictogram te kiezen.
5. (Optioneel) Klik op het **Instellingen**-tabblad in het Inspector-paneel, open **Toegankelijkheid** en voer een beschrijving voor schermlezers in het **Toegankelijke naam**-veld in.

**Productlijst**

De productlijst toont de producten in de geselecteerde categorie.

1. Selecteer de productenlijst op de pagina.
2. Klik in de actiebalk op **Indeling wijzigen**.
3. Kies hoe de producten worden weergegeven:  
   * **Kies Indeling:** Selecteer **Kaarten**, **Lijst**, **Schuifregelaar** of **Geavanceerd raster**.  
   * **Items per rij instellen:** Activeer de schakelaar en voer het aantal producten in dat je in elke rij wilt.
4. (Optioneel) Klik op de Modus-dropdown bovenaan de lijst en selecteer **Normale modus** of **Geen items** om te ontwerpen hoe de lijst eruitziet met of zonder producten.

**Link naar productpagina**

De productafbeelding linkt naar de productpagina.

1. Selecteer een productafbeelding op de pagina.
2. Klik in het Inspector-paneel op het **Instellingen**-tabblad.
3. Kies hoe de afbeelding werkt:  
   * **Afbeelding:** Toont de belangrijkste media van het product.  
   * **Alt-tekst:** Toont de productgegevens die worden gebruikt als de alt-tekst van de afbeelding.  
   * **Weergavemodus:** Selecteer **Opvullen**, **Passen** of **Beeldverhouding behouden**.  
   * **Link:** Toont de link naar de productpagina.
4. (Optioneel) Klik in de actiebalk op **Afbeelding** of **Masker** vervangen om de afbeelding of de vorm ervan te wijzigen.

**Linten**

1. Selecteer de linten op een product.
2. Klik in het Inspector-paneel op het **Ontwerp**-tabblad.
3. Selecteer het onderdeel dat je wilt opmaken onder **Kies wat je wilt ontwerpen**: **Linten**, **Primair lint** of **Extra lint**.

**Productnaam**

1. Selecteer de productnaam op de pagina.
2. Klik op het **Ontwerp**-tabblad in het Inspector-paneel en pas de tekst aan in het **Typografie**-gedeelte, zoals het lettertype en de grootte.

**Prijs**

1. Selecteer de prijs op een product.
2. Klik in het Inspector-paneel op het **Instellingen**-tabblad.
3. Kies hoe je de prijs wilt weergeven in het **Eigenschappen**-gedeelte:  
   * **Oorspronkelijke prijs eerst:** Schakel dit in om de prijs vóór de verkoop eerst weer te geven.  
   * **Van-label:** Voer de tekst in die vóór de prijs verschijnt wanneer de prijs van een product varieert.
4. (Optioneel) Klik bovenaan het element op de Modus-dropdown en selecteer **Normale modus**, **In de uitverkoop**, **Prijsklasse** of **Volledige prijs** om die versie van de prijs te ontwerpen.

**Meer producten laden**

1. Scrol naar de onderkant van de productenlijst en selecteer de **Meer laden**-knop.
2. Klik in het Inspector-paneel op het **Instellingen**-tabblad.
3. Pas de knop in het **Eigenschappen**-gedeelte aan:  
   * **Tekst:** Voer de tekst in die op de knop verschijnt.  
   * **Linkt naar:** Klik op **Kies een link** om in te stellen waar de knop naartoe leidt.  
   * **Uitgeschakeld:** Activeer de schakelaar om de knop uit te schakelen.
4. (Optioneel) Klik op het **Ontwerp**-tabblad en selecteer **Knop** of **Tekst** onder **Kies wat je wilt ontwerpen** om dat onderdeel op te maken.