Dynamisch filteren in Divi 5 Loops
Met de komst van Divi 5 is er veel veranderd onder de motorkap. Eén van de grootste veranderingen is de manier waarop Loops werken. Divi 5 is fundamenteel anders dan Divi 4. Webwerkplaats’ filter plugin werkt wel.
Wanneer je een Divi Loop maakt, wil je in veel gevallen kunnen filteren. Denk aan filteren op:
- categorie
- jaartal
- merk
- status (verkocht / te koop)
- of andere custom fields
Tot voor kort bestond er geen goede, dynamische filteroplossing speciaal voor Divi 5 Loops. Deze plugin van Webwerkplaats vult dat gat.
Even terug: wat is een Divi Loop?
Een Divi Loop (Loop Element) in Divi 5 is de manier om dynamisch content weer te geven: berichten, custom post types of andere databronnen, in een herhaalbare layout.
Wil je meer achtergrond over hoe Loops precies werken in Divi 5, dan heb ik daar al een uitgebreide uitleg over geschreven:https://webwerkplaats.nl/uitleg-divi-5-loop-builder
Deze filterplugin bouwt direct voort op dat Loop Element.
Automatisch herkennen, nauwelijks instellen
Wat deze plugin uniek maakt, is dat bijna alles automatisch wordt gedetecteerd.
In het admin gedeelte van WordPress ga je naar:
Instellingen → Dynamic Filters
Daar gebeurt het volgende:
- De plugin detecteert automatisch alle custom post types
- Per post type worden alle custom fields en taxonomieën opgehaald
- Jij hoeft alleen maar aan te vinken welke filters je zichtbaar wilt maken
Bestaat er (nog) geen custom post type, dan laat de plugin dat ook netjes weten met een duidelijke melding. Geen giswerk, geen stille fouten.
Filters toevoegen met één shortcode
De filters plaats je in de Divi 5 Builder met een shortcode. Dat kan in een Tekstmodule of Code module en werkt op iedere pagina.
Een voorbeeld:
Op basis van jouw instellingen worden automatisch de juiste dropdowns gegenereerd, inclusief:
-
een Filter knop
-
een Reset knop (om alles weer leeg te maken)
De resetknop verschijnt alleen wanneer er daadwerkelijk gefilterd is. Alles werkt via AJAX, dus zonder herladen van de pagina.
Naadloze koppeling met de Divi 5 Loop
Onder de filters plaats je een Divi Loop Element, ingesteld op hetzelfde custom post type. De plugin haakt in op dezelfde manier waarop Divi 5 zelf met resultaten werkt (via de posts_results filter).
Het resultaat:
-
filters werken direct met de Loop
-
meerdere filters tegelijk zijn mogelijk
-
het aantal resultaten wordt correct bijgewerkt
-
geen hacks of workarounds
Belangrijk om te weten:
–
– Niet compatibel met Divi 4, omdat Loops daar technisch anders werken
Flexibel, maar beheersbaar
Je kunt:
-
verschillende filters gebruiken per custom post type
-
meerdere filtersets op verschillende pagina’s hebben
-
kiezen tussen een standaard (donkere) stijl of een lichte variant
De styling is bewust rustig gehouden en kan desgewenst verder aangepast worden via CSS.
Samengevat
Deze plugin is ontstaan vanuit een praktisch probleem:
“Waarom kan ik in Divi 5 wel Loops maken, maar ze niet dynamisch filteren?”
Het antwoord is nu: dat kan wél.
Automatisch, dynamisch en afgestemd op hoe Divi 5 echt werkt.
Nuttig?
Werk je met Divi 5, gebruik je Loops en zie je het nut van dynamisch filteren op custom post types?
Dan kun je me altijd even mailen om te kijken of dit past binnen jouw Divi 5 project.
