Plugin YITH WooCommerce Ajax Product Filter Premium - 5.23.0

YITH WooCommerce Ajax Product Filter Premium ist ein Plugin, das Ihrem WooCommerce-Shop Filterpanels in AJAX-Technologie hinzufügt – sie grenzen die Produktliste ein, ohne die Seite neu zu laden. Presets, Preisregler, Farbmuster und die Variantenfilterung bewähren sich in Modeshops und großen Katalogen, wo die Navigation oft zum Flaschenhals wird.

Filtern per AJAX und Filter-Presets auf beliebigen Shopseiten

YITH WooCommerce Ajax Product Filter baut Filterpanels in AJAX-Technologie auf, sodass sich die Produktliste sofort eingrenzt, ohne dass die gesamte Seite neu geladen wird. Einzelne Filter lassen sich zu Presets zusammenfassen – fertigen Zusammenstellungen, die der Shopseite, einer einzelnen Kategorie oder einer beliebigen individuellen Seite zugeordnet werden. Jedes Preset lässt sich per Widget, Shortcode, Gutenberg-Block oder einem dedizierten Elementor-Widget einbinden.

Wie Filter-Presets funktionieren und wo Sie sie zuordnen

Ein Preset ist eine im Panel gespeicherte Zusammenstellung von Filtern, die an einer bestimmten Stelle im Shop verankert ist. Eines übernimmt die Shopseite. Ein zweites eine einzelne Kategorie, und ein drittes eine Kollektionsseite, die außerhalb der Standardansichten von WooCommerce aufgebaut wurde.

Das Preset-System hat die frühere Konfiguration auf Basis der klassischen Layered-Navigation-Widgets abgelöst. Die alten Widgets funktionieren weiterhin, und ein integriertes Werkzeug überführt sie in Presets. Es gibt außerdem ein Standard-Preset mit allen Filtern – überflüssige Positionen müssen Sie nur deaktivieren, und das Panel läuft mit wenigen Klicks.

Widget, Shortcode, Gutenberg-Block und Elementor-Widget

Das Filterpanel lässt sich auf mehrere Arten einbinden, je nach Seitenlayout. Das klassische Widget landet in der Sidebar oder im Widget-Bereich des Themes. Der Shortcode [yith_wcan_filters] fügt die Filter an beliebiger Stelle im Inhalt ein, während der Gutenberg-Block und das Elementor-Widget sie in den visuellen Editoren ergänzen. So gelangen die Filter auch auf individuelle Seiten, die das Standard-WooCommerce nicht unterstützt.

Automatische Filterbefüllung aus Kategorien, Tags und Attributen

Die automatische Befüllung synchronisiert den Filter mit den WooCommerce-Taxonomien – Kategorien, Tags und Attributen. Ein neuer, im Shop hinzugefügter Begriff erscheint von selbst im Filter, ohne dass die Optionsliste manuell aktualisiert werden muss.

Die Begriffe lassen sich alphabetisch, nach Anzahl der Produkte oder in einer eigenen Reihenfolge anordnen. Neben jeder Option kann ein Zähler der passenden Produkte stehen, und beim Überfahren mit dem Mauszeiger erscheint ein Tooltip.

Filtertypen: Preis, Farbe, Bewertung, Verfügbarkeit und Angebot

YITH WooCommerce Ajax Product Filter bietet Filter nach Kategorie, Tag und jedem beliebigen WooCommerce-Attribut – Farbe, Größe oder Material. Die Premium-Edition ergänzt den Regler und feste Preisbereiche, einen Filter nach Bewertung aus Rezensionen sowie Verfügbarkeits- und Angebotsfilter. Jede Option lässt sich als Checkbox, Radiobutton, Dropdown-Liste, Label oder Farbmuster anzeigen.

Preisfilter — Regler und Preisbereiche

Der Preisfilter funktioniert in zwei Modi. Der erste ist ein Bereichsregler – der Kunde zieht die Preisgrenzen, und optionale Felder „von“ und „bis“ nehmen manuell eingegebene Beträge entgegen. Der zweite sind fest definierte Preisbereiche in beliebiger Anzahl, wobei die letzte Stufe die Form „und mehr“ annimmt.

Die Währung im Filter übernimmt die WooCommerce-Einstellungen, sodass ein Shop mit Preisen in Euro die Bereiche in Euro anzeigt.

Farbmuster, Labels und Anzeigestile

Die Filteroptionen lassen sich auf viele Arten anzeigen: als Checkboxen, Radiobuttons, Dropdown-Listen, Mehrfachauswahl, Text-Labels oder Farbmuster. Die Muster selbst sind rund oder quadratisch, in der Premium-Edition auch zweifarbig und mit Bild – sie geben dann Farbverläufe, Texturen und Stoffmuster wieder. Diese Stilauswahl passt zu Shops mit Bekleidung und Materialien in komplexen Farbtönen.

Filter nach Bewertung, Verfügbarkeit und Angebot sowie AJAX-Sortierung

Der Bewertungsfilter grenzt die Liste nach der Anzahl der Sterne aus Rezensionen ein und siebt niedrig bewertete Produkte aus. Die Verfügbarkeits- und Angebotsfilter beschränken die Ergebnisse auf Positionen „nur auf Lager“ oder „nur reduziert“. Die AJAX-Sortierung ordnet sie nach Beliebtheit, Datum, Preis oder Durchschnittsbewertung – ebenfalls ohne Neuladen der Seite.

Variantenfilterung, mobiles Layout und dynamische Filter

Die Variantenfilterung in YITH WooCommerce Ajax Product Filter tauscht in der Liste das übergeordnete Produkt gegen die passende Variante aus – zusammen mit ihrem Foto und Preis. Nach der Auswahl „Farbe: Schwarz“ sieht man die schwarze Version des T-Shirts und nicht die generische Miniaturansicht. Die Premium-Edition ergänzt ein modales Layout für Mobilgeräte, horizontale Filter über der Produktliste sowie dynamische Filter, die die verfügbaren Optionen an die Auswahl anpassen.

Filterung von Produktvarianten

Standardmäßig zeigt WooCommerce in der Listenansicht das übergeordnete Produkt, unabhängig von der gewählten Variante. Die Variantenfilterung kehrt diese Logik um: Erfüllt eine konkrete Variante die Filterkriterien, landet genau sie in der Liste – mit ausgetauschtem Foto, Preis und Daten. Der Kunde sieht sofort das, wonach er sucht, zum Beispiel schwarze Schuhe in Größe 42.

Modales Layout für Mobilgeräte

Auf Smartphones und Tablets öffnen sich die Filter in einem modalen Fenster, statt Platz in der Sidebar zu belegen. Der Kunde markiert die Begriffe im Overlay, bestätigt die Auswahl und kehrt zur Liste zurück, wobei die Ansicht selbstständig an den Anfang der Ergebnisse scrollt.

Dieses Layout entspricht den UX-Mustern großer E-Commerce-Plattformen. Es unterscheidet das Plugin zudem von Lösungen, die Filter einfach unter die Produktliste hängen.

Horizontale und dynamische Filter (adaptive filtering)

Horizontale Filter (horizontal toolbar) verlagern die Filterleiste über die Produktliste, statt sie in einer Seitenspalte zu halten – ein Layout, wie man es von Plattformen à la Zalando kennt. Dynamische Filter passen die verfügbaren Optionen an die aktuelle Auswahl an: Nicht passende Begriffe lassen sich ausgrauen und sperren, statt sie auszublenden, und nach der Wahl einer Kategorie verschwinden Filter, die nicht zu ihr passen.

Der Arbeitsmodus lässt sich zwischen sofortiger AJAX-Filterung und der Schaltfläche „Filter anwenden“ umschalten – je nach Vorliebe des Shops.

Für welche Shops sich YITH Ajax Product Filter am besten eignet

YITH WooCommerce Ajax Product Filter eignet sich am besten für Mode- und Schuhshops mit vielen Farb- und Größenvarianten, für mittlere und große Kataloge, in denen die Navigation zum Flaschenhals wird, sowie für Shops, die auf anderen YITH-Plugins aufbauen. Bei einem Katalog mit Zehntausenden Produkten oder dem Bedarf, nach ACF-Feldern zu filtern, greift man besser zu einer Lösung mit dediziertem Index.

Modeshops und Shops mit vielen Varianten

Ein Sortiment mit den Attributen Farbe, Größe und Material profitiert am meisten von Farbmustern, Labels und der Variantenfilterung. Der Kunde sieht die konkrete Variante mit Foto statt eines generischen übergeordneten Produkts, was den Weg zur richtigen Position verkürzt.

Für welche Shops sich das Plugin am besten eignet:

• Mode- und Schuhshops mit den Attributen Farbe, Größe und Material.
• Mittlere und große Kataloge, in denen die Navigation durch das Angebot den Einkauf bremst.
• Shops, die bereits andere YITH-Plugins nutzen.
• Websites mit individuellem Seitenlayout in Elementor oder Gutenberg.
• Shops mit einem hohen Anteil an mobilem Traffic.

Shops im YITH-Ökosystem und mit individuellem Seitenlayout

Shops, die auf anderen YITH-Plugins basieren, erhalten eine einheitliche, wechselseitig kompatible Filterung – alle YITH-Produkte teilen sich ein gemeinsames Framework. Die Integrationen mit YITH Brands, Color & Label Variations sowie Ajax Search erweitern das Filterpanel ohne zusätzlichen Entwicklungsaufwand.

Die Filter lassen sich auch auf individuelle Kollektionsseiten einbinden, die in Elementor oder Gutenberg erstellt wurden, außerhalb der Standardansichten von WooCommerce.

Für wen das Plugin nicht die beste Wahl ist

Das Plugin stützt die Filterung auf zahlreiche WP_Query-Abfragen, sodass die Ladezeit bei einem Katalog mit Zehntausenden Produkten und vielen Attributen spürbar steigen kann. Es greift außerdem nicht auf eigene Felder oder Inhalte außerhalb von WooCommerce zu.

Für wen das Plugin nicht die beste Wahl ist:

• Shops mit einem sehr großen Katalog (Zehntausende Produkte und Dutzende Attribute) – bei dieser Größenordnung sind Lösungen mit dediziertem Index wie FacetWP oder FiboFilters oft leistungsfähiger.
• Projekte, die eine Filterung nach eigenen Feldern (Custom Fields / ACF) benötigen – das Plugin unterstützt dies nicht.
• Websites, die andere Inhalte als WooCommerce-Produkte filtern, zum Beispiel Beiträge oder eigene Inhaltstypen.

Integrationen mit YITH-Plugins, WPML und Seiten-Buildern

YITH WooCommerce Ajax Product Filter lässt sich nativ mit anderen YITH-Plugins integrieren – das Brands Add-on fügt einen Markenfilter hinzu, Color & Label Variations versorgt die Farbmuster und Labels, und Ajax Search zusammen mit Infinite Scrolling erweitern die Suche sowie die Produktlisten. Das Panel selbst ist zu 100 % mit WPML kompatibel und stellt einen dedizierten Gutenberg-Block sowie ein Elementor-Widget bereit.

YITH-Ökosystem (Brands, Color & Label Variations, Ajax Search)

Das YITH WooCommerce Brands Add-on führt die Marke als Taxonomie ein, die der Filter verarbeiten kann – ohne dieses Add-on ist die Marke kein Standardattribut. YITH Color, Image & Label Variation Swatches liefert Farben, Labels und Musterbilder, die bei den Produktvarianten konfiguriert werden.

YITH Ajax Search zeigt einen Filterbereich im Overlay der Suche an, und YITH Infinite Scrolling ersetzt die Seitennummerierung durch ein fortlaufendes Nachladen der Liste – auch nach der AJAX-Filterung. Das Panel arbeitet außerdem mit YITH Wishlist sowie dem hauseigenen Theme Proteo zusammen.

Mehrsprachigkeit (WPML, Weglot, Loco Translate) und Seiten-Builder

Die Mehrsprachigkeit basiert auf voller, getesteter Kompatibilität mit WPML, daneben funktionieren auch Weglot und Loco Translate. Das Plugin ist translation ready, sodass sich die Oberflächenbeschriftungen mit eigenen Sprachdateien übersetzen lassen. Auf der Builder-Seite stehen ein dedizierter Gutenberg-Block sowie ein Elementor-Widget bereit, und in den übrigen Editoren fügt der Shortcode [yith_wcan_filters] die Filter ein.

Technische Anforderungen und Kompatibilität

YITH WooCommerce Ajax Product Filter benötigt WordPress 6.8 oder neuer sowie WooCommerce 10.7 oder neuer, mit empfohlenem PHP 7.4+ (idealerweise 8.0+). Das Plugin erklärt Kompatibilität mit HPOS, ist translation ready und vollständig mit WPML kompatibel. Der Hersteller bestätigt unter anderem die Unterstützung für die Themes Astra, Avada, Divi, Flatsome, Storefront, Porto und Proteo sowie die Builder Gutenberg und Elementor.

WordPress-, WooCommerce- und PHP-Versionen

Die Mindestanforderungen sind WordPress 6.8 und WooCommerce 10.7, wobei das Plugin mit den aktuellen Versionen beider Systeme Schritt hält. Als PHP-Umgebung werden 7.4 oder neuer empfohlen, idealerweise 8.0+ – entsprechend den Anforderungen aktueller WooCommerce-Versionen. Die Kompatibilität mit HPOS (High-Performance Order Storage) erklärt der Hersteller.

Kompatibilität mit Themes und Buildern

Der Hersteller bestätigt die einwandfreie Funktion mit gängigen WooCommerce-Themes – Astra, Avada, Divi, Flatsome, Storefront, Porto sowie dem hauseigenen Proteo, neben vielen weiteren. Die Filter lassen sich nativ per Gutenberg-Block und Elementor-Widget einbinden, in den übrigen Buildern per Shortcode.

Hinweis zur Kompatibilität: Eine vollständige Kompatibilität mit jedem Theme ist nicht möglich – das Plugin funktioniert einwandfrei mit Themes, die sich an die Standards von WordPress und WooCommerce halten. Bei stark individuellen Templates kann es erforderlich sein, den passenden Container-Selektor anzugeben, damit sich nach der Filterung nur die Produktliste aktualisiert und nicht die gesamte Seite.

Häufig gestellte Fragen