Met WooCommerce Product Table kun je product tabellen, ook wel productlijst of bestelformulier genoemd, toevoegen aan je webshop. Klanten kunnen hierdoor direct vanaf een eenvoudige pagina meerdere producten kunnen bestellen.
Dit is bijvoorbeeld handig als je een restaurant hebt en alle gerechten wil tonen in een eenvoudig tabel in plaats van allerlei verschillende pagina’s. Ook voor groothandels is het handig om klanten in bulk te laten bestellen direct vanaf één pagina.
Helaas heeft WooCommerce niet van zichzelf een optie om een tabel vol met producten te tonen om te bestellen. We hebben hiervoor dus een WooCommerce Product Table plugin voor nodig.
In dit artikel zal ik je uitleggen in welke situaties product tabellen allemaal handig zijn om te gebruiken, welke plugin je kunt gebruiken en hoe de plugin werkt.
Inhoudsopgave
Waarom een product tabel gebruiken?
WooCommerce laat standaard producten altijd zien in een simpele grid layout zoals je hieronder kunt zien.
Voor veel webshops is dit best prima, maar het is lang niet in alle situaties even handig. Deze optie laat bijvoorbeeld niet de belangrijkste features van een product zien, het is lastiger door alle producten heen te komen en je kunt een product niet heel eenvoudig in het winkelmandje plaatsen.
Om dit allemaal eenvoudiger te maken voor je bezoeker kun je de product grid layout ook aanpassen naar een product table layout. Dit kan met behulp van een Product table plugin voor WooCommerce.
Het voordeel hiervan is dat je een beter overzicht hebt van alle producten, de belangrijkste informatie meteen duidelijk gemaakt kan worden en product super snel aan de winkelwagen toegevoegd kunnen worden zonder de product tabel pagina ook maar te verlaten. Verder kun je bezoekers ook direct in het tabel laten zoeken wat erg snel werkt.
In welke situaties een product tabel gebruiken in WooCommerce?
Zoals ik al zei is de standaard grid layout voor veel webshops al voldoende. Er zijn echter bepaalde type webshops die ik kan aanbevelen om zeker eens een product tabel uit te proberen, omdat het de conversie kan verhogen en het gebruiksgemak voor bezoekers prettiger maakt.
In de volgende situaties zou ik voor een WooCommerce product table plugin gaan:
- Restaurants en cafés: Ideaal voor het presenteren van een interactief online menu waar klanten gemakkelijk kunnen bestellen vanuit één pagina. Denk aan thuisbezorgd, Uber Eats of andere apps. Hier hoeven mensen ook niet telkens naar een andere pagina om een gerecht toe te voegen aan een bestelling. Op jouw webshop zou ik dit dan ook niet anders doen.
- Groothandels / B2B webshops: Wanneer je klanten een mogelijkheid wil geven om snel grote bestellingen te plaatsen, dan is productlijst (tabel) een handige manier om klanten vanaf één pagina bulk bestellingen te laten plaatsen.
- Bestelformulier: Wanneer je een bestelformulier wilt maken voor klanten, dan is een product tabel een hele handige optie die kan dienen als bestelformulier.
- Boekenwinkel: Bij een boekenwinkel kan een product tabel ook handig zijn wanneer je bezoekers een handig overzicht wil geven van alle boeken met informatie over de auteur, publicatiedatum en genre.
- Catalogusweergave: Wil je op jouw website een catalogus weergeven, dan is een product tabel ook een handige optie om direct alles in één overzicht goed weer te geven.
Uiteraard zijn er vast nog tal van andere opties waarvoor een product tabel handig kan zijn. Bekijk dus naar de situatie van jouw webshop om te bepalen of dit een handige optie is voor jou.
WooCommerce Product Table plugin instellen
Nu je weet wanneer een product tabel handig is om te gebruiken, wil je waarschijnlijk ook wel weten hoe zo’n plugin precies werkt. In dit artikel heb ik het over de WooCommerce Product Table plugin van Barn2.
Je kunt de plugin uiteraard installeren net als ieder andere plugin. Je krijgt een download en kunt deze uploaden via Plugins → Nieuwe Plugin → Plugin uploaden.
Wanneer je de WooCommerce product table plugin hebt geïnstalleerd en geactiveerd op je website kom je direct in de setup wizard terecht waar je het een en ander kunt instellen.
Het start natuurlijk met dat je de licentie van de plugin moet activeren. Dit zal geen uitleg nodig hebben dus laten we op ‘Next’ klikken om door te gaan.
Je kunt nu aangeven waar je de product tabellen automatisch wilt laten weergeven. Wil je bijvoorbeeld de winkelpagina direct omtoveren naar een product tabel met al je producten, dan kun je een vinkje plaatsen bij Shop page.
Hetzelfde kun je doen als je standaard een product tabel wil maken op de zoekresultaten-, categorie-, tags-, en product eigenschap pagina’s.
Wil je het nergens standaard gebruiken omdat je bijvoorbeeld een speciale bestelformulier pagina wil maken, dan hoef je nergens een vinkje te zetten. Je kunt altijd een tabel toevoegen aan een pagina met behulp van een shortcode of de WooCommerce Table Products blok. Vul alles in zoals je het hebben wil en klik op ‘Next’.
Je kunt nu bij Columns aangeven welke kolommen je wilt weergeven in je product tabel. Standaard staan bovenstaande dingen ingesteld, maar je kunt het naar wens aanpassen. De mogelijkheden die je hebt qua kolommen zijn: sku, id, name, description, summary, date, date_modified, categories, tags, image, reviews, stock, weight, dimensions, price, buy, and button.
Wat overigens goed is om te weten is dat je de kolommen ook nog zelf kunt instellen als je bijvoorbeeld de WooCommerce product table toont op een pagina van je website met behulp van een blok in de blok editor. Dit is echter hoe het standaard weergegeven zal worden als je niks aanpast aan het tabel.
Bij Lazy Load kun je inschakelen of alle producten direct getoond mogen worden of dat een deel pas geladen moet worden als mensen hiernaartoe scrollen. Klik op ‘Next’ als je hebt ingesteld zoals je het hebben wilt.
Add to cart method geeft je de mogelijkheid om te kiezen of mensen het product kunnen selecteren om toe te voegen aan de winkelwagen. Een andere optie die je hebt is om een ‘voeg toe aan winkelwagen’ knop toe te voegen. De checkbox vind ik persoonlijk handiger, omdat je dan aan het einde alles in één keer kunt toevoegen aan de winkelwagen.
Quantities zal niet veel uitleg nodig hebben. Wanneer je hier een vinkje plaatst kunnen klanten bij een product het aantal aangeven.
Variations is mijn inziens het makkelijks om als een dropdown lijst te tonen. Andere opties zijn dat je iedere variatie op een eigen regel laat plaatsen in het tabel of dat er een lees verder knop komt naar het variabele product.
Wanneer je alles hebt ingesteld klikken we weer op ‘next’. We komen nu bij de instellingen voor de filter boven het tabel uit.
Bij Product filters kun je tonen gebaseerd op de content van het tabel of je kunt zelf custom filters maken. Wanneer je voor custom kiest kun je bij Custom filters aangeven waarop het tabel gefilterd kan worden.
Dit was de laatste pagina van de installatiewizard. Je krijgt nadat je voor de laatste keer op ‘next’ klikt gezien dat de setup geslaagd is en je alles hebt ingesteld. Ook staat er een knop richting de instellingen pagina. Deze pagina kun je overigens altijd vinden via Woocommerce → Instellingen → Producten. De pagina ziet er als volgt uit:
Je krijgt hier eigenlijk vrijwel dezelfde instellingen te zien als die je in de installatiewizard tegen bent gekomen. Mocht je dus iets willen aanpassen op een later moment, dan is dit de plek.
Product tabel toevoegen aan een pagina op je webshop
Hierboven heb je al kunnen instellen op welke momenten er standaard een product tabel getoond kan worden op de website. Zo was het al mogelijk om onder andere je categoriepagina’s en winkelpagina om te toveren naar een product tabel.
Het kan echter ook zijn dat je jouw webshop jouw webshop wil laten, maar op specifieke pagina’s een product tabel wilt toevoegen. In dit soort gevallen heb je de mogelijkheid om een tabel toe te voegen met behulp van het Product Table blok in de blok editor of je kunt een shortcode gebruiken. Ik zal je hieronder uitleggen hoe het werkt.
Product tabel toevoegen met het Product Table blok
De makkelijkste methode mijn inziens is om lekker in de standaard editor van WordPress voor het blok Product Table te gaan. Om dit blok in de editor te krijgen kun je een gratis add-on te downloaden genaamd Gutenberg Block for WooCommerce Product Table. Wanneer je deze plugin hebt geactiveerd krijg je in de editor het Product table blok en als je dit blok toevoegt krijg je de volgende opties te zien.
Aan de linkerkant kun je kolommen toevoegen die je in het product tabel wilt weergeven. Wil je niet alle producten tonen, dan is dit ook geen probleem. Aan de rechterkant kun je aangeven welke producten je in het product tabel wilt laten weergeven. Dit kan gebaseerd op categorie, tag, aangepaste velden, eigenschappen, jaar, maand, dag, status, ID of eerder bestelde producten door de gebruiker die de lijst bekijkt.
Product tabel toevoegen met een shortcode
Een product tabel toevoegen met behulp van een shortcode is ook een optie. De standaard shortcode is:
[product_table]Wanneer je deze shortcode gebruikt zal een product tabel getoond worden gebaseerd op de standaard instellingen.
Wil je een ander type tabel tonen dan hoe je het de tabelinstellingen standaard hebt ingesteld, dan kun je de shortcode aanpassen. Voor alle opties kun je hier terecht, maar ik zal je alvast een voorbeeld geven.
In onderstaand voorbeeld geven we aan welke kolommen we willen weergeven en willen we enkel producten tonen die in de categorie ebooks staan.
[product_table columns="sku,name,description,price,buy" category="ebooks"]Meer werk dan dit is het niet, dus ook shortcodes zijn zeker een goede optie als je niks visueels nodig hebt.
