header-logo
Hoe Wix gebruiken om je website en bedrijf te bouwen.
Ontwerp en beheer je website met slimmme functionaliteiten.
Beheer abonnementen, pakketten en facturen.
Run je bedrijf en kom in contact met leden.
Lees hoe je een domein koopt, koppelt of overzet.
De juiste tools om je bedrijf op het web te laten groeien.
Boost je zichtbaarheid met SEO en marketingtools.
Geavanceerde functies om efficiënter te kunnen werken.
Antwoorden op vragen, gekende problemen en meer.
placeholder-preview-image
Verbeter je vaardigheden met onze cursussen en video's.
Krijg tips voor webdesign, marketing en meer.
Lees hoe het organische websiteverkeer van zoekmachines te vergroten.
Bouw een eigen website met ons full-stack platform.
Vind een professional voor hulp om je websitedoelen te behalen.
placeholder-preview-image
In dit artikel
  • Stap 1 | Voeg een dynamische lijstpagina toe voor je producten
  • Stap 2 | Koppel je repeater aan het CMS
  • Stap 3 | (Optioneel) Beheer de dataset-instellingen
  • Stap 4 | (Optioneel) Laat klanten producten filteren
  • Stap 5 | (Optioneel) Voeg 'Meer laden'- of navigatieknoppen toe

CMS: Wix Stores-producten weergeven op een dynamische lijstpagina

9 min
In dit artikel
  • Stap 1 | Voeg een dynamische lijstpagina toe voor je producten
  • Stap 2 | Koppel je repeater aan het CMS
  • Stap 3 | (Optioneel) Beheer de dataset-instellingen
  • Stap 4 | (Optioneel) Laat klanten producten filteren
  • Stap 5 | (Optioneel) Voeg 'Meer laden'- of navigatieknoppen toe
Gebruik het CMS (Content Management System) om creatief te worden met de weergave van je Wix Stores-producten door ze te presenteren in een volledig aanpasbare repeater op een dynamische lijstpagina. Kies alleen de pagina-elementen die je nodig hebt (bijvoorbeeld tekst, knoppen en afbeeldingen) en koppel ze aan de relevante velden die door je producten worden gebruikt (bijvoorbeeld: de naam, prijs en hoeveelheid op voorraad). 

Je kunt knoppen of afbeeldingen aan je productpagina koppelen, zodat klanten erop kunnen klikken om meer te lezen voordat ze tot aankoop overgaan. Je kunt ook 'In winkelwagen'- en 'Snel bekijken'-knoppen maken voor een naadloze winkelervaring.
Screenshot van het weergeven van producten in een repeater.
Voordat je begint:

Stap 1 | Voeg een dynamische lijstpagina toe voor je producten

Ga naar Wix-appverzamelingen in het CMS van je editor en maak een dynamische lijstpagina van de Stores-verzameling. Deze pagina bevat een repeater die al gedeeltelijk is gekoppeld aan je Stores-producten.
  1. Ga naar je editor.
  2. Klik links in de editor op CMS .
  3. Klik links op Wix app-verzamelingen.
  4. Scrol omlaag naar StoreCatalog of Stores, wijs Producten aan en klik op het Meer acties-pictogram
Tips:
  1. Selecteer Dynamische pagina toevoegen
Screenshot van het toevoegen van een dynamische pagina in de Wix Editor.
  1. Klik op Lijstpagina
  2. Klik op Toevoegen aan website
Tip:
Je kunt je producten in een professionele galerij of tabel weergeven in plaats van een repeater. Verwijder hiervoor de repeater en voeg een galerij of tabel toe. Volg daarna de rest van de stappen in dit artikel om je galerij of repeater aan het CMS te koppelen.

Stap 2 | Koppel je repeater aan het CMS

Koppel de repeater aan een dataset die is gekoppeld aan je Wix Stores-productenverzameling. Koppel dan elk repeater-element aan de dynamische waarden van je verzameling die veranderen afhankelijk van het getoonde product. Je kunt een afbeelding of knop in je repeater koppelen aan de 'In winkelwagen'- of 'Snel bekijken'-klikacties. 
  1. (Optioneel) Voeg elementen toe aan je repeater (bijvoorbeeld knoppen, tekst, afbeeldingen) of verwijder elementen die je niet nodig hebt. Je kunt de grootte van de repeater aanpassen zodat deze alle elementen kan bevatten. 
  2. Klik op het repeater-element en selecteer het Aan CMS koppelen-pictogram .
  3. Klik op de Kies een dataset-dropdown en selecteer Producten.
  4. Klik onder Koppelingen op het repeater-element dat je wilt koppelen.
    Let op: Als je de standaard repeater gebruikt die bij de dynamische pagina is geleverd, zijn de Afbeelding- en Tekst-elementen al gekoppeld. Je kunt extra tekstelementen verwijderen of loskoppelen en vervangen door statische tekst. 
  5. Klik op de relevante dropdownmenu's en kies welke Wix Stores-velden gekoppeld zijn aan elk deel van het element. 
    Tip: Je kunt linken naar de URL (Wix Stores-catalogus V3) of Pagina-URL (Wix Stores Catalogus V1)-veld om klanten een manier te geven om te klikken om naar de relevante Stores-productpagina te gaan. 
Screenshot van de koppelingsopties van een repeater.
  1. Klik op Repeater-koppelingen en herhaal stap 4-5 hierboven om extra elementen in de repeater te koppelen. 
  2. Klik om je repeater-elementen naar behoefte aan te passen.
    Tip: Je kunt op elk moment elementen toevoegen aan of verwijderen uit je repeater. Ontkoppel elementen als je statische inhoud wilt gebruiken die niet verandert volgens de relevante categorie. 
  3. Klik op Voorbeeld om je dynamische productenpagina te testen.
  4. Klik op Publiceren als je klaar bent om de wijzigingen live te laten gaan. 

Stap 3 | (Optioneel) Beheer de dataset-instellingen

In je dataset-instellingen kun je het maximum aantal producten kiezen dat tegelijk kan worden weergegeven. Je kunt ook filters toevoegen om alleen bepaalde producten op te nemen, of sorteringen toevoegen om de volgorde waarin de producten worden weergegeven te bepalen. 
Let op:
Het Items per belasting-veld is niet van toepassing op tabellen. Als je een tabel gebruikt om je producten weer te geven, kun je het aantal weergegeven items beperken door op het Indeling-pictogram  te klikken. Stel daarna een aangepaste tabelhoogte in en schakel paginering in. 
  1. Klik in je editor op de repeater of pro gallery.
  2. Klik op het Aan CMS koppelen-pictogram .
  3. Klik op Dataset-instellingen
  4. (Optioneel) Klik op het machtigingstype naast Machtigingen om te bepalen wie verzamelingsinhoud op je live website kan bekijken, toevoegen, bijwerken of verwijderen. 
  5. Bewerk het Items per keer laden-veld om het maximum aantal items in te stellen dat tegelijk kan worden geladen.  
    Let op: Dit is ook het maximum aantal items dat kan worden geladen wanneer bezoekers op 'Meer laden'-knoppen, 'Volgende/vorige pagina'-knoppen of pagineringsbalken klikken.
  6. (Optioneel) Klik op + Filter toevoegen om alleen specifieke producten in de repeater weer te geven
  7. (Optioneel) Klik op + Sortering toevoegen om de volgorde te kiezen waarin de producten in de repeater verschijnen.
  8. Klik op Voorbeeld om je dynamische productenpagina te testen.
  9. Klik op Publiceren als je klaar bent om de wijzigingen live te laten gaan. 

Stap 4 | (Optioneel) Laat klanten producten filteren

Geef shoppers een manier om alleen producten te bekijken die overeenkomen met de filters die ze toepassen, zoals prijs, voorraad of merk. Kies uit een van de volgende invoerelementen die filteren toestaan: keuzerondjes, selectievakjes, dropdowns, selectietags, of schuifregelaars (alleen bereikschuifregelaars).
Screenshot van een dropdown-invoerelement voor het filteren van items op een live website.

Stap 5 | (Optioneel) Voeg 'Meer laden'- of navigatieknoppen toe

Je kunt de prestaties van je pagina verbeteren door het aantal producten dat verschijnt te beperken en een 'Meer laden'-knop toe te voegen. 

Voeg navigatieknoppen toe om kopers te laten klikken om de volgende/vorige pagina met weergegeven producten te bekijken of voeg een pagineringsbalk toe om door een bepaald aantal producten tegelijk te bladeren. 
Screenshot van het maken van een 'Meer laden'-knop.
Tip:
Lees meer over de CMS-dataset-acties die je kunt toepassen op knoppen en afbeeldingen.

Helpmate

Hallo,

Een beetje meer begeleiding nodig?
Samenvatting van dit artikel
Unlock personalized helpLog in to get the most out of Helpmate.