SearchWP Blog

WordPress-Tutorials, Tipps und Ressourcen, die Ihnen helfen, Ihr Geschäft auszubauen

So fügen Sie einen Suchfeld-Filter zu WooCommerce hinzu

Einen WooCommerce-Shop mit vielen Produkten zu betreiben, kann es für Kunden schwierig machen, genau das zu finden, was sie brauchen.

Stellen Sie sich zum Beispiel vor, Ihre Besucher landen auf der Shop-Seite, scrollen durch Dutzende von Produkten und verlassen den Shop, ohne etwas zu kaufen, nur weil sie den richtigen Artikel nicht schnell genug finden konnten.

Die beste Lösung dafür ist, direkt auf Ihrer Shop-Seite einen Suchfeld-Filter hinzuzufügen. So können Käufer ein Stichwort eingeben und die Produktliste direkt auf der Shop-Seite filtern, ohne auf eine separate Ergebnisseite weitergeleitet zu werden.

In diesem Artikel zeigen wir Ihnen, wie Sie Ihrer WooCommerce-Produktliste einen Suchfeld-Filter hinzufügen.

Warum einen Suchfeld-Filter zu Ihrem WooCommerce-Shop hinzufügen?

Standardmäßig bietet WooCommerce keine Möglichkeit für Kunden, Produkte direkt auf der Shop-Seite zu suchen und zu filtern.

Die integrierte WordPress-Suche leitet Besucher auf eine separate Suchergebnisseite. Dies unterbricht das Einkaufserlebnis und lenkt Kunden von Ihrem Shop ab.

Ein Suchfeld-Filter löst dieses Problem, indem er es Kunden ermöglicht, ein Stichwort einzugeben und die Produktliste in Echtzeit, genau dort, wo sie sich befinden, zu verfeinern. Es gibt kein Seiten-Neuladen und keine Weiterleitung.

Denken Sie an ein Bekleidungsgeschäft mit 300 Produkten. Ohne Filter muss ein Kunde, der nach einem „schwarzen Hoodie“ sucht, jeden Artikel durchscrollen, um ihn zu finden. Mit einem Suchfeld-Filter gibt er das Stichwort ein und sieht in Sekundenschnelle nur relevante Produkte.

Dies hält Käufer fokussiert, reduziert Frustration und erleichtert das Finden und Kaufen von Produkten. Für Shop-Betreiber bedeutet dies in der Regel höhere Konversionsraten und weniger abgebrochene Sitzungen.

Nun wollen wir uns ansehen, wie Sie dies zu Ihrem Shop hinzufügen können, ohne eine einzige Zeile Code zu schreiben.

So zeigen Sie einen Suchfeld-Filter für WooCommerce an

Der einfachste Weg, Ihrer WooCommerce-Produktliste einen Suchfeld-Filter hinzuzufügen, ist die Verwendung eines Plugins wie WPFilters.

WPFilters - Bestes WordPress-Filter-Plugin

WPFilters ist das beste Filter-Plugin für WordPress, mit dem Sie Amazon-ähnliche Filter zu Ihrem WooCommerce-Shop hinzufügen können, ohne eine einzige Zeile Code schreiben zu müssen.

Es wird vom selben Team entwickelt, das auch hinter SearchWP steht, daher wissen wir, dass es zuverlässig funktioniert und Ihre Produktdaten effizient verarbeitet.

Mit WPFilters können Sie ein dediziertes Suchfeld erstellen, das Ihre Produktliste in Echtzeit filtert. Sie können es auch mit anderen Filtern wie Preisreglern, Kategorie-Checkboxes oder Tag-Filtern kombinieren, um Kunden die volle Kontrolle über ihr Einkaufserlebnis zu geben.

Einige der Dinge, die Sie mit WPFilters tun können:

  • Fügen Sie ein Stichwort-Suchfeld hinzu, das Produkte sofort filtert, während Kunden tippen
  • Erstellen Sie Preisbereichsregler, Kategorie-Checkboxes und Tag-Filter
  • Zeigen Sie Filter mit dem Gutenberg-Block, Shortcode oder PHP-Code an
  • Passen Sie Darstellungseinstellungen an, z. B. das Anzeigen eines Titels oder das Ausklappbar machen

Nun sehen wir uns an, wie Sie WPFilters verwenden können, um Ihrer WooCommerce-Shop einen Suchfeld-Filter hinzuzufügen.

Schritt 1: WPFilters installieren und aktivieren

Zuerst müssen Sie die SearchWP-Website besuchen und sich für ein WPFilters-Konto anmelden.

Sobald Sie ein Konto haben, gehen Sie zum Download-Tab in Ihrem Dashboard.

WPFilters-Plugin-Zip-Dateien herunterladen

Klicken Sie hier auf die Schaltfläche Download WPFilters, um die ZIP-Datei des Plugins auf Ihrem Computer zu speichern. Wir empfehlen außerdem, Ihren Lizenzschlüssel von dieser Seite zu kopieren, da Sie ihn bald benötigen werden.

Als Nächstes müssen Sie die Plugin-Datei auf Ihre WordPress-Site hochladen und installieren. Wenn Sie nicht sicher sind, wie das geht, lesen Sie bitte diese Anleitung zum Installieren eines WordPress-Plugins.

Nachdem Sie das Plugin aktiviert haben, erscheint der Einrichtungsassistent. Klicken Sie auf die Schaltfläche „Los geht’s“ und folgen Sie den Anweisungen auf dem Bildschirm, um die Einrichtung abzuschließen.

WPFilters-Einrichtungsassistent

Schritt 2: Erstellen Sie ein neues Suchfilter-Element

Jetzt, da das Plugin aktiv ist, ist es an der Zeit, Ihre Suchbox zu erstellen.

Navigieren Sie dazu einfach in Ihrem WordPress-Dashboard zu WPFilters » Elemente.

Klicken Sie dann auf die Schaltfläche Neu hinzufügen, um ein leeres Filterelement zu erstellen.

Neuen Filter hinzufügen

Geben Sie Ihrem Filter oben auf der Seite einen Namen. Etwas wie „Produkt-Suche oder Stichwort-Suchfilter“ funktioniert gut.

Wählen Sie im Abschnitt Feldtyp die Option Suche aus.

Suchfilteroption auswählen

Dadurch wird ein Live-Texteingabefeld erstellt, in das Kunden tippen können, um die Produktliste zu filtern. Klicken Sie auf die Schaltfläche Speichern in der oberen rechten Ecke.

Sie sehen nun eine Vorschau der Suchbox im rechten Bereich.

Schritt 3: Passen Sie die Einstellungen der Suchbox an

Als Nächstes können Sie anpassen, wie die Suchbox für Ihre Besucher aussieht und sich verhält.

Scrollen Sie nach unten zum Abschnitt Container. Hier können Sie die Option Titel anzeigen aktivieren, um eine Beschriftung über der Suchbox anzuzeigen.

Sie können auch die Option Einklappbar aktivieren, wenn Besucher den Filter ausblenden können sollen.

Container-Einstellungen für Suchfeld ändern

Wenn Sie mit den Einstellungen zufrieden sind, scrollen Sie nach oben und klicken Sie auf die Schaltfläche Speichern.

Schritt 4: Fügen Sie den Suchfilter zu Ihrem WooCommerce-Shop hinzu

Nachdem Ihr Suchfilter fertig ist, ist der letzte Schritt, ihn dort zu platzieren, wo Kunden ihn finden und verwenden können.

WPFilters bietet Ihnen verschiedene Möglichkeiten, dies zu tun.

Klicken Sie dazu auf die Schaltfläche Einbetten in der oberen rechten Ecke der Elementseite.

Klicken Sie auf die Schaltfläche "Filter einbetten"

Ein Popup-Fenster mit verschiedenen Einbettungsoptionen wird angezeigt.

Dazu gehören ein Gutenberg-Block, ein Shortcode oder ein PHP-Snippet für Entwickler.

Suchfilter einbetten

Außerdem können Sie wählen, ob Sie eine vorhandene Seite auswählen oder eine neue Seite erstellen möchten.

Eine weitere beliebte Option ist die Platzierung der Suchbox in der Seitenleiste Ihrer Shop-Seite. So bleibt der Filter für Kunden, die durch die Produkte scrollen, jederzeit sichtbar.

Gehen Sie dazu in Ihrem WordPress-Dashboard zu Darstellung » Widgets. Beachten Sie, dass dieser Schritt je nach Ihrem WordPress-Theme anders aussehen kann.

Suchen Sie den Seitenleistenbereich, der von Ihrer Shop-Seite verwendet wird, und klicken Sie auf die Schaltfläche +, um einen neuen Block hinzuzufügen. Suchen Sie nach dem Widget WPFilters Element.

WPFilters-Element-Widget-Block zur WooCommerce-Seitenleiste hinzufügen

Sobald Sie es hinzugefügt haben, wählen Sie Ihren Stichwort-Suchfilter aus dem Dropdown-Menü WPFilters Element-Einstellungen im Einstellungsbereich aus.

Klicken Sie auf die Schaltfläche Aktualisieren, wenn Sie fertig sind.

Wählen Sie Ihren Schlüsselwort-Suchfilter

Besuchen Sie nun Ihre WooCommerce-Shop-Seite, um die Suchbox im Einsatz zu sehen.

Wenn ein Kunde ein Schlüsselwort in das Feld eingibt, wird die Produktliste in Echtzeit gefiltert, um nur passende Artikel anzuzeigen.

Schlüsselwort-Suchfilter anzeigen

FAQs zum Hinzufügen eines Suchfeld-Filters zu WooCommerce

1. Funktioniert dies mit variablen Produkten?

Ja, das tut es. WPFilters funktioniert mit allen Standard-WooCommerce-Produkttypen, einschließlich einfacher, variabler und gruppierter Produkte. Das Suchfeld gleicht den Produkttitel und die Beschreibung ab, unabhängig vom Produkttyp.

2. Kann ich dies mit anderen Filtern wie Preis oder Kategorie kombinieren?

Absolut. Sie können mehrere Filterelemente erstellen und sie zusammen in der Seitenleiste oder über dem Produktgitter platzieren. Sie können beispielsweise das Suchfeld mit einem Kategorie-Checkbox-Filter und einem Preisbereichs-Schieberegler stapeln, damit Kunden Ergebnisse aus mehreren Blickwinkeln gleichzeitig eingrenzen können.

3. Benötige ich SearchWP, um WPFilters zu verwenden?

Nein, WPFilters funktioniert als eigenständiges Plugin. SearchWP und WPFilters sind separate Produkte desselben Teams, daher lassen sie sich gut integrieren, aber keines von beiden ist für die Funktion auf das andere angewiesen.

Wir hoffen, dieser Artikel hat Ihnen geholfen zu lernen, wie Sie einen Suchfeld-Filter zu Ihrer WooCommerce-Produktliste hinzufügen. Möglicherweise möchten Sie auch unsere Anleitungen zum Filtern nach mehreren Taxonomien in WordPress und zum Hinzufügen einer Live-Autocomplete-Suche zu WordPress sehen.

Sind Sie bereit, Ihren Kunden eine schnellere Möglichkeit zu bieten, Produkte zu finden? Sie können hier mit WPFilters loslegen.

Autor-Avatar
Aazim Akhtar

Erstellen Sie noch heute eine bessere WordPress-Sucherfahrung

Verlieren Sie nie wieder Besucher an unzureichende Suchergebnisse. SearchWP macht die Erstellung Ihrer eigenen intelligenten WordPress-Suche schnell und einfach.

Get SearchWP Now
Symbol für mehrere Suchmaschinen