Über eine optimierte Filterung Produkte schnell und einfach finden

Damit die eigene Kundschaft schnell und einfach das gewünschtes Produkt findet, sollten die Filter auf den Kategorieseiten übersichtlich gestaltet und angeordnet werden. Sie dienen dazu, die Anzahl der Ergebnisse nach relevanten Kriterien zu reduzieren und können das Einkaufserlebnis deutlich verbessern.

Die richtige Bezeichnung für die Filterung

Wenn möglich sollte für die Überschrift oder die Schaltfläche zum Öffnen der Filterung nicht der Fachbegriff "Filter" genutzt werden, da er nicht allen Besucher geläufig ist. Sinnvolle Alternativen wären zum Beispiel "Ergebnisse filtern" oder auch "Suche verfeinern".

Shopware 6 zeigt die Filter in den kleineren Auflösungen bis 991 Pixeln erst dann an, wenn die Schaltfläche "Filter" angeklickt wurde. Diesen Text kann man unter "Einstellungen", "Shop" und "Textbausteine" nach der Auswahl des Textbaustein-Sets über den Textbaustein "listing.filterTitleText" nach den eigenen Vorstellungen anpassen.

Wo sollte die Filterung platziert werden?

Die am meisten verbreitete Position für die Filterung ist links neben der Produktliste. Diese hat den Vorteil, dass die meisten sie an dieser Stelle erwarten. Insofern die Filterung beim Scrollen an dieser Stelle anhaftet (über den sogenannten Sticky-Effekt), müssen die Nutzer dann auch nicht jedes Mal an den Seitenanfang zurück scrollen, um die Filter anzupassen.

Wenn sich in der linken Sidebar jedoch bereits die Navigation befindet und diese viele Elemente enthält, empfiehlt es sich, die Filterung stattdessen über der Produktliste anzuzeigen. Dort ist sie meist leichter zugänglich und auch auffälliger platziert. Jedoch muss bei dieser Position darauf geachtet werden, dass die Filterung nicht die Produkte verdrängt und der Nutzer am Ende gerade in kleineren Auflösungen vor lauter Filtern keine Produkte mehr sieht. Dies kann umgangen werden, indem die Filter erst nach dem Anklicken einer Schaltfläche erscheinen oder indem die Höhe des Bereichs begrenzt und ein Link wie "Mehr Filter anzeigen" eingeblendet wird. Da bei dieser Position fast alle Filter nebeneinander angezeigt werden können, ist in diesem Fall die Reihenfolge der Filter auch weniger relevant.

Um in Shopware 6 die Filterung in der linken Sidebar anzeigen zu lassen, muss der jeweiligen Kategorie ein Layout vom Typ "Kategorieseite" zugewiesen werden, bei dem die Sektion "Sidebar" ausgewählt wurde. Soll die Filterung stattdessen über der Produktliste erscheinen, muss man dazu die Sektion "Volle Breite" auswählen. Anschließend muss nur noch das Element "Produkt-Filter" aus der Block-Kategorie "Sidebar" per Drag & Drop im linken Bereich oder oberhalb des Elements "Produkt-Listing" platziert werden.

Die richtige Menge an Filtern und die richtige Sortierung

Wenn zu viele Filter zur Auswahl stehen, kann dies schnell unübersichtlich werden. Deshalb sollte man nur die Filter anbieten, die für die meisten Nutzer entscheidend sind. Die relevantesten sollten dabei ganz vorne beziehungsweise ganz oben stehen. Es kann zwar mühselig sein, dies für jede Kategorie einzeln festzulegen, es lohnt sich aber. Bei den Filteroptionen sollte stattdessen darauf geachtet werden, dass sie sinnvoll sortiert sind. Bei einem Markenfilter kann es Sinn ergeben, dessen Optionen alphabetisch zu sortieren, bei Größen wie XS, S, M, L und XL sicher nicht. Wenn auf einer Kategorieseite nur wenige Produkte angezeigt werden, ist es auch eine Überlegung wert, in diesem Fall ganz auf die Filterung zu verzichten.

Welche Filter bei einer Kategorie angezeigt werden sollen, legt man in Shopware 6 nach der Auswahl der Kategorie unter "Kataloge" und "Kategorien" im Tab "Layout" im Bereich "Produkt-Listing" fest. An dieser Stelle können die Standard-Filter "Hersteller", "Bewertung", "Preis" und "kostenloser Versand" deaktiviert werden. Um einzelne Filter auszublenden, die sich aus den filterbaren Produkteigenschaften ergeben, muss man den Schalter "Filterbare Produkteigenschaften konfigurieren" aktivieren und anschließend bei den Eigenschaften den Schalter nach rechts schieben, die eingeblendet werden sollen.

Die Sortierung der Filter kann bei der jeweiligen filterbaren Eigenschaft unter "Kataloge" und "Eigenschaften" festgelegt werden, indem man im Bereich "Basisinformation" beim Feld "Position" eine Zahl vergibt. Umso höher die Zahl ist, umso weiter hinten beziehungsweise weiter unten wird der Filter angezeigt. Insofern bei einer filterbaren Eigenschaft beim Feld "Sortierung" der Wert "Individuell" ausgewählt wurde, können auch die Filteroptionen über das Feld "Position" entsprechend sortiert werden.

Um bei einer Kategorie gar keine Filterung anzuzeigen, reicht es aus, bei dem Layout das Element "Produkt-Filter" zu entfernen, dass der jeweiligen Kategorie unter "Kataloge" und "Kategorien" im Tab "Layout" zugewiesen wurde.

Die beste Darstellungsform für die Filter

Generell sind für die Filter Checkboxen und Auswahlfelder empfehlenswert. Bei den Auswahlfeldern sollte die Möglichkeit bestehen, eine Mehrfachauswahl vornehmen zu können. Außerdem ist es ratsam, bei einem Farbfilter neben dem Farbnamen auch ein Farbkästchen mit anzeigen zu lassen. Bei einem Bewertungsfilter lohnt sich die zusätzliche Darstellung von Bewertungssternen. Die Filterung nach dem Preis sollte mindestens über ein Feld für den Minimal- und für den Maximalwert verfügen.

Shopware 6 bietet bei den Kategorieseiten bereits im Standard die Möglichkeit an, Filter über Checkboxen oder Auswahlfelder zu setzen. Eine Mehrfachauswahl ist bei den Auswahlfeldern genauso möglich wie die Filterung nach den Bewertungen und dem Preis in der zuvor beschriebenen Form. Insofern man bei dem Feld "Darstellung der Ausprägungsauswahl" einer filterbaren Eigenschaft den Wert "Farbe" ausgewählt hat, wird einem vor der jeweiligen Filteroption ein Farbkästchen mit der Farbe angezeigt, die zuvor bei der entsprechenden Option bei dem Feld "Farbe" ausgewählt wurde. Auch Filteroptionen mit vorangestellten Bildern lassen sich über den Wert "Bild" bei dem Feld "Darstellung der Ausprägungsauswahl" umsetzen. Die Zuweisung des Bildes zur jeweiligen Option erfolgt in diesem Fall über das Feld "Standardbild".

Nützliche Funktionen für die Filterung, die das Nutzererlebnis verbessern

Wenn die Möglichkeit besteht, sollten sich die angezeigten Produkte bei jedem neu aus- oder abgewählten Filter live anpassen, ohne dass die komplette Seite neu geladen werden muss. Zudem ist es ratsam, die bereits gewählten Filteroptionen unterhalb der Filter anzeigen zu lassen, damit der Nutzer sofort erkennen kann, nach welchen Optionen gerade gefiltert wird. Darüber hinaus sollte die einzelne Abwahl einer ausgewählten Option genauso möglich sein wie die gesamte Filterung über eine Schaltfläche wie "Alle Filter zurücksetzen" auf einmal aufzuheben. Wenn ein Filter kein Ergebnis liefert, sollte er deaktiviert sein. Um lange Listen zu verkürzen, könnte man ein Suchfeld über den Filteroptionen anbieten, über das die Optionen noch einmal zusätzlich gefiltert werden können.

In Shopware 6 werden bei jeder Änderung einer Filteroption die angezeigten Produkte live neu geladen, ohne das die komplette Seite aktualisiert wird. Dies ist auch bei der Betätigung der Schaltfläche "Alle zurücksetzen" der Fall, deren Text man über den Textbaustein "listing.filterPanelResetAll" anpassen kann. Außerdem werden die bereits gewählten Filteroptionen unterhalb der Filterung angezeigt und automatisch die Filter deaktiviert, die keine Ergebnisse liefern, insofern der Schalter "Filteroptionen ohne Ergebnisse deaktivieren" unter "Einstellungen", "Shop" und "Produkte" im Bereich "Produkt" aktiviert wurde. Ein Suchfeld über den Filteroptionen kann man beispielsweise über die Erweiterung "Filter Suche" realisieren.