Filter und Suchplugin von Next AG
«Intelligentes Suchen und Filtern!»
Zwei der wichtigsten Shopfunktionen sind in der aktuellen Shopware Version 6.2.0 nicht befriedigend gelöst. Erst ab der Enterprise-Edition steht eine ausgereifte Elasticsearch Suche bereit. Für das Filtersystem gibt es aktuell weder von Shopware noch von Plugin Anbietern eine zufriedenstellende Lösung.
Um dieses Problem für unsere Kunden grundlegend zu lösen, haben wir ein eigenes voll anpassbares und konfigurierbares Plugin geschrieben, welches im Live Shop von Platzhirsch bewundert werden kann.
Technisches
Das Plugin baut auf Elasticsearch auf und nutzt im Shopware-Frontend Vue.js für die Listendarstellung und die Suchergebnisseite. Dabei werden wie gewohnt Twig-Templates verwendet, so dass dieses Plugin von einem selbstentwickelten Theme überschrieben und gestylt werden kann. Durch den Aufbau von Elasticsearch- und Filterindices im Hintergrund wird eine ausserordentliche Performance erreicht. Das System arbeitet vollständig Ajax-basiert ohne Seitenreloads.
Features
Plugin-Konfiguration
Elasticsearch-Konfiguration
- Beliebige Produktattribute, Produkteigenschaften und Produktzusatzfelder können per Konfiguration indiziert werden.
- Es wird eine 2-stufige Suche «Exakt» und dann «Volltext» angeboten.
- Die Gewichtung und der Fuzzinessfaktor können für jedes Attribut eingestellt werden.
Filter-Konfiguration
- Beliebige Produktattribute, Produkteigenschaften und Produktzusatzfelder können als Filter verwendet werden (Mehrsprachigkeit und Mehrfachwerte werden korrekt verarbeitet).
- Filter können optional per Konfiguration als Buttons (Auslobungen wie z.B. Aktion oder Restposten) dargestellt werden.
- In jedem Filter kann ein Suchfeld aktiviert werden (Type-ahead).
- Filter mit vielen Filtereigenschaften können mit einem «show more» Button reduziert und optimiert werden.
- Filter können einzeln oder gesamthaft per Klick zurückgesetzt werden.
- Filtereigenschaften und Filter können mit Und/Oder verknüpft werden.
- Die Sortierung der Artikelattribute kann eingestellt werden.
Produktlistenansicht
- Zu jedem Filterattribut wird die Anzahl gefundener Artikel angezeigt.
- Die Filter sind voneinander abhängig. D.h. das Klicken eines Filters reduziert die Filtermöglichkeiten der anderen Filter.
- Die Filter sind volldynamisch. D.h. Filtereigenschaften ohne Produkte werden automatisch ausgeblendet.
- Die auf den Produktkacheln anzuzeigenden Attribute wie Bild, Name, Artikelnummer, Preis, Warenkorb etc. können per Konfiguration eingestellt werden.
- Filter können als Buttons oder als echte Filter konfiguriert werden.
- Es kann konfiguriert werden, ob verschiedene Sortierungen angeboten werden sollen.
- Es kann zwischen einem normalen Pagersystem, Infinite-Scroll oder Infinite-Scroll mit «More»-Button gewählt werden.
- Alle Filtereinstellung werden «gemerkt» und stehen sowohl beim Seitenreload als auch beim Wechsel zur Produktdetailseite und zurück wieder zur Verfügung.
- Ist der Infinite-Scroll aktiviert, wird beim Wechsel von der Produktdetailseite zurück auf die Listenansicht wieder automatisch zum angeklickten Produkt gescrollt.
Suche
- Die Darstellung im Search-Dropdown kann per Konfiguration vollständig individualisiert werden.
- Das Dropdown arbeitet auch auf mobilen Geräten korrekt mit Scrollbar.
- Die Suche erfolgt 2-stufig: Zuerst werden die als exakt definierten Attribute nach dem exakt eingegebenen Wert durchsucht (sinnvoll z. B. bei der Suche nach Artikel- oder EAN-Nummer). Werden Treffer gefunden, werden nur diese in der Dropdown-Vorschau angezeigt und erst bei «Alle Anzeigen» wird die Volltextsuche ausgeführt. Wird nichts gefunden, wird eine Volltextsuche für alle konfigurierten Attribute mit entsprechender Gewichtung und Fuzziness ausgeführt. Die konfigurierte Anzahl an Ergebnissen wird in der Dropdown-Vorschau angezeigt.
Auf der Suchergebnisseite kann per Konfiguration das Filtersystem für die weitere Eingrenzung aktiviert werden.
Intelligentes Suchen und Filtern!
Von Next AG in einem standardisierten Shopware 6 Plugin optimal und wiederverwendbar gelöst!
