Beste WooCommerce filter om producten in je webshop te filteren

Misschien weet je dat deze website niet de enige website is die ik heb. Ik heb ook een aantal andere websites zoals moederdochterboek.nl en een aantal affiliate websites. En één website daarvan is een webshop. Voor die webshop had ik natuurlijk een goede Woocommerce filter nodig om de producten te filteren.

Uiteraard heb ik op deze website, waar je nu deze blog leest, ook een webshop met digitale producten, maar de website die ik nu bedoel is echt een ‘klassieke’ webshop met kleding. Voor deze website wilde ik echt geen consessies doen wat betreft de gebruikerservaring. Als ik zelf ergens bezoeker ben vind ik het filteren heel belangrijk. Gaat het filteren niet goed, dan ben ik zo weer weg.

De werking van zo’n filter in je webshop is dus belangrijk!

De beste filter-plugin voor WooCommerce die ik heb gevonden

Ik heb een aantal filter-plugins geprobeerd maar ze waren het allemaal net niet. Maar uiteindelijk heb ik deze gevonden en die werkt heel erg lekker: AJAX Products Filter van BeRocket

Wat kan je met deze WooCommerce productfilter?

Het belangrijkste is natuurlijk: je kunt met deze plugin filters maken om je producten in je webshop te filteren. Maar je kunt ook andere elementen kiezen die belangrijk zijn bij het filteren van producten in een webshop. 

Elementen die je kunt kiezen zijn o.a.

• filter met checkboxjes
• filter met kleurtjes (om dus te filteren op kleur van het product)
• filter in de vorm van een dropdown
• filter met vlaggetjes
• een kalender om te filteren op datum
• een slider om te filteren op een waarde zoals prijs
• een overzicht van filters die actief zijn die je met een kruisje weer weg kunt halen
• knop met ‘filters toepassen’ (je kiest zelf de exacte tekst)
• knop met ‘filters wissen’ (je kiest zelf de exacte tekst)
• zoekbalk om te zoeken in de producten
• mogelijkheid om producten te sorteren

En je kunt per element uit verschillende soort layout / designs kiezen.

De meeste van deze functies zijn gratis en sommige betaald, zoals de slider om te filteren op prijs. 

Hier kies je welk soort element je wil gebruiken.

Als je ‘filter’ kiest, zijn er verschillende soorten filters waar je uit kunt kiezen

Waarom heet het Ajax en wat is Ajax in WordPress?

Misschien vind je Ajax een rare naam voor een plugin. Of misschien ben je deze term al weleens eerder tegengekomen in WordPress, bij andere plugins of in deze context. 

Ajax is een soort code (HTML, CSS and JavaScript) die ervoor zorgt dat als je bijvoorbeeld filtert of ontfiltert, de pagina NIET opnieuw geladen wordt. Wat natuurlijk heel belangrijk is voor een filter. Stel je voor dat jouw webshop elke keer opnieuw geladen wordt als iemand filtert, dat is iets wat je absoluut niet wil!

(Het maakt de ervaring voor je bezoeker trager en vervelend en het is niet goed voor je statistieken.)

Wat zijn de nadelen van deze WooCommerce productfilter?

Er zijn een paar kleine nadelen aan deze filter plugin.

1. De support is niet slecht (ik stelde een vraag in de community en kreeg binnen een dag antwoord) maar het Engels dat gesproken wordt is niet top. Dat geldt ook voor de documentatie die erbij zit. Het is echt in het houtje-touwtje Engels.

   Maar de tech skills van de developers zijn stukken beter dan hun Engels gelukkig!

2. Je kunt binnen de plugin zelf niet alle kleuren aanpassen van de filters. Dat kan gelukkig wel met CSS (code) en is ons goed gelukt. Het was niet moeilijk maar je moet even zoeken.

Hoe stel je de AJAX products filter in? Hoe werkt het?

Om deze filter te gebruiken heb je een aantal ‘ingrediënten’ nodig:

– eigenschappen (attributes) van je producten
– een zijbalk in je shop
– de widgets (die vind je in WordPress onder Weergave (Appearance)
– deze plugin

1. Voor je een filter kunt aanmaken is het handig om eerst de eigenschappen van de producten aan te maken.

2. Dan maak je de filters aan in de plugin. Dat doe je door in de plugin op Add filter te klikken en dan bij Conditions in te vullen waar de filter getoond moet worden en vervolgens de filter (of ander element) naar keuze te selecteren en vervolgens op te slaan.
Je kunt ook de instellingen van een eerdere filter kopiëren als je veel filters aan moet maken.

3. Als je alle filters (of andere elementen) die je wil hebt aangemaakt, ga je naar Widgets (onder Weergave / Appearance) en klik je bij Zijbalk op de + en voeg je daar alle filters toe die je gemaakt hebt.
Dat doe je door in de lijst van mogelijkheden die je daar toe kunt voegen, BeRocket op de zoeken en deze op de juiste plek te slepen. Je plaatst dus waarschijnlijk meerdere filters onder elkaar in de zijbalk. Klik op Opslaan als je klaar bent. 

4. Vervolgens voeg je in je shop de zijbalk toe als deel van de pagina.

That’s it! 

(Ik heb deze beschrijving gemaakt op basis van mijn eigen ervaring en ik gebruik Divi) 

Wat kost deze plugin?

Je kunt de plugin gratis gebruiken. Dan zijn er aardig wat opties. Ik heb zelf de betaalde versie want ik vond de slider, om te filteren op prijs, onmisbaar voor mijn shop. Ook wilde ik de maten niet allemaal in één kolom onder elkaar en met de betaalde versie heb ik de mogelijkheid om er 3 kolommen van te maken.

De betaalde versie kost eenmalig $44 voor één website. Ik heb zelf $69 betaald zodat ik de plugin voor 3 websites kan gebruiken.

Eigenschappen in meerdere kolommen zodat het niet zo’n lange opsomming wordt. Met css hebben we de kleuren aangepast.

Deze blog bevat affiliate links. Mocht je via zo’n link een product kopen of abonnement afsluiten, dan ontvang ik daar een kleine fee voor. Jij betaalt niks extra, de prijzen zijn hetzelfde en in sommige gevallen krijg je zelfs korting of een langere proefperiode.

Ik schrijf deze blogs op basis van mijn eigen ervaring of doe altijd gedegen onderzoek; je kunt er dus op rekenen dat mijn content oprecht is. 

Blogs die je misschien ook interessant vindt