Intelligentes Filter-System
Kaskadierende Filter mit dynamischen Counts
Filter
Kurs-Anzeige
Frontend
AJAX
Intelligentes Filter-System
Das kaskadierende Filter-System ermoeglicht es Besuchern, Kurse nach Service-Typ, Kategorie und Monat zu filtern - mit dynamischen Zahlen und ohne Seiten-Neuladen.
Funktionsweise
Bidirektionale Kaskadierung
Die drei Filter beeinflussen sich gegenseitig:
| Aktion | Ergebnis |
|---|---|
| Service-Typ waehlen | Kategorie + Monat zeigen nur passende Optionen |
| Kategorie waehlen | Service-Typ + Monat zeigen nur passende Optionen |
| Monat waehlen | Service-Typ + Kategorie zeigen nur passende Optionen |
Beispiel: Waehlt ein Besucher "Workshop", zeigt der Monats-Filter nur Monate an, in denen tatsaechlich Workshops stattfinden.
Dynamische Counts
Jede Filter-Option zeigt in Klammern die Anzahl der verfuegbaren Kurse:
Service-Typ:
- Alle Service-Typen
- Praesenz-Kurs (22)
- Webinar (3)
- Workshop (1)
Nur zukuenftige Kurse werden gezaehlt - vergangene Termine werden automatisch ausgeblendet.
AJAX-Filterung
Die Kurse laden ohne Seiten-Neuladen:
- Filteraenderung → Kurse werden sofort aktualisiert
- URL wird synchron gehalten (Filter per Link teilbar)
- Smooth Loading-Animation waehrend des Ladens
Aktivierung
Global (Standard fuer alle Seiten)
- Admin → Kurs-Buchung → Einstellungen
- Tab Kurs-Anzeige oeffnen
- Filter-Modus auf "Kaskadierend" setzen
- Speichern
Pro Seite
- Seite im Editor oeffnen
- Meta-Box "Kurs-Anzeige Einstellungen" finden (rechte Spalte)
- Filter-Modus auswaehlen
- Seite speichern
Per Shortcode
[kurs_cards filter_mode="cascade"]
Parameter:
| Parameter | Werte | Beschreibung |
|---|---|---|
filter_mode |
independent / cascade |
Filter-Verhalten |
show_filter |
true / false |
Filter anzeigen |
produktart |
z.B. kurs |
Nur bestimmte Service-Typen |
Hierarchie
Die Einstellungen gelten in folgender Reihenfolge (hoechste Prioritaet zuerst):
- Shortcode-Parameter (z.B.
filter_mode="cascade") - Seiten-Einstellungen (Meta-Box)
- Globale Einstellungen (Admin → Einstellungen)
Filter-Modi
| Modus | Verhalten |
|---|---|
| Unabhaengig | Alle Filter zeigen immer alle Optionen |
| Kaskadierend | Filter schraenken sich gegenseitig ein |
Technische Details
Neue PHP-Klassen
| Klasse | Aufgabe |
|---|---|
Kurs_Booking_Filter_Cascade |
Kaskaden-Logik, SQL-Queries |
Kurs_Booking_Filter_Cascade_Ajax |
AJAX-Endpoints, HTML-Rendering |
JavaScript-Module
| Datei | Aufgabe |
|---|---|
filter-cascade.js |
Dropdown-Synchronisierung |
filter-ajax.js |
AJAX Card-Loading, URL-Updates |
AJAX-Endpoints
| Action | Beschreibung |
|---|---|
kurs_booking_cascade_filter |
Dropdown-Optionen aktualisieren |
kurs_booking_filter_cards |
Kurs-Cards HTML laden |
Hinweise
- Performance: Counts werden effizient per SQL berechnet (GROUP BY)
- Cache: Redis Object Cache wird genutzt falls aktiv
- SEO: URLs mit Filterparametern sind indexierbar
- Mobile: Filter funktioniert vollstaendig auf Mobilgeraeten