Müssen Sie ein benutzerdefiniertes Suchformular für Ihre WordPress-Website erstellen?
Die Suche ist die Art und Weise, wie die meisten Benutzer Inhalte auf Ihrer Website finden. Wenn sie nicht leicht finden, wonach sie suchen, wechseln sie möglicherweise zu einer anderen Website.
In diesem Artikel zeigen wir Ihnen Schritt für Schritt, wie Sie Ihre Website-Suche verbessern können, indem Sie ein benutzerdefiniertes WordPress-Suchformular erstellen.
Warum ein benutzerdefiniertes Suchformular für WordPress erstellen?
Die standardmäßige WordPress-Suchfunktion ist ziemlich eingeschränkt und findet nicht immer die relevantesten Inhalte.
Wenn Sie Ihrer Website mehr Inhalt hinzufügen, benötigen Sie bessere Möglichkeiten, damit Ihre Website-Besucher die Inhalte auf Ihrer Website leichter finden können.
Dies wird umso wichtiger, wenn Sie einen Online-Shop oder eine Mitgliedschaftsseite betreiben, auf der Benutzer das richtige Produkt oder den richtigen Kurs finden sollen.
Möglicherweise möchten Sie auch den Suchalgorithmus anpassen, um bestimmte Inhalte höher als andere anzuzeigen, oder das Erscheinungsbild Ihres Suchformulars anpassen.
Lassen Sie uns jedoch einen Blick darauf werfen, wie Sie das WordPress-Suchformular und die Ergebnisseite anpassen. Wir werden zwei Methoden behandeln, die Sie über die folgenden Links auswählen können:
So passen Sie das WordPress-Suchformular und die Ergebnisse an
SearchWP ist das beste benutzerdefinierte Such-Plugin für WordPress. Es ist einfach zu bedienen, gibt Ihnen die vollständige Kontrolle über Ihre Suchergebnisse und ist genauer als die standardmäßige WordPress-Suche.
Der erste Schritt ist die Installation des SearchWP-Plugins. Weitere Informationen finden Sie in unserer Schritt-für-Schritt-Anleitung zur Installation eines WordPress-Plugins.
Nach der Aktivierung müssen Sie die Einstellungen » SucheWP Seite und klicken Sie dann auf den Menüpunkt ‚Lizenz‘.
Geben Sie dann Ihren Lizenzschlüssel in das Feld „Lizenz“ ein und klicken Sie auf die Schaltfläche „Aktivieren“. Sie finden diese Informationen in Ihrem Konto auf der SearchWP-Website.
Anpassen der Suchmaschine
Sobald Sie dies getan haben, müssen Sie auf die Menüoption ‚Engines‘ klicken. Dort sollten Sie auf die Schaltfläche „Neu hinzufügen“ klicken, um eine neue Suchmaschine zu erstellen.
Dadurch wird eine neue Suchmaschine namens „supplemental“ erstellt. Um den Namen zu ändern, müssen Sie auf die Schaltfläche „Quellen & Einstellungen“ klicken.
Dadurch gelangen Sie zu einer Seite, auf der Sie auch auswählen können, ob Sie nach Beiträgen, Seiten, Mediendateien, Kommentaren und Benutzern suchen möchten. Wir belassen die Standardeinstellungen wie sie sind.
Wir ändern den Namen der Suchmaschine in „Benutzerdefiniert“. Fahren Sie fort und geben Sie das in das Feld „Engine Label“ ein.
Beachten Sie, dass die Option „Keyword Stems“ für Sie ausgewählt wurde. Dadurch werden Wortendungen bei einer Suche Ihrer Nutzer ignoriert, sodass die relevantesten Suchergebnisse angezeigt werden.
Stellen Sie sicher, dass Sie auf die Schaltfläche „Fertig“ klicken, wenn Sie fertig sind.
Die Einstellungsseite für die Suchmaschine enthält Abschnitte für Beiträge, Seiten, Medien und Benutzer. In jedem Abschnitt können Sie verschiedenen Beitragsattributen Priorität einräumen oder nur bestimmte Kategorien oder Tags in Ihre Suchergebnisse aufnehmen.
Sie können dies tun, indem Sie die Schieberegler „Attributrelevanz“ anpassen.
Diese ändern, wie die Suchmaschinen Inhalte bewerten und einordnen. Wenn Sie beispielsweise den Beitragstitel höher bewerten möchten als den Inhalt, können Sie den Schieberegler entsprechend anpassen.
Sie sollten jeden Abschnitt durcharbeiten und die gewünschten Anpassungen an den Schiebereglern vornehmen.
Sie können auch für jeden Abschnitt Regeln erstellen, die bestimmen, ob bestimmte Inhalte in den Suchergebnissen enthalten oder davon ausgeschlossen werden.
Sie können Ihren Besuchern beispielsweise ermöglichen, ganz einfach nach Inhalten zu demselben Thema zu suchen, über das sie gerade gelesen haben. Oder in einem Online-Shop können Sie Ihren Kunden helfen, schnell andere Produkte in derselben Kategorie zu finden.
Fahren Sie fort und klicken Sie im Abschnitt „Beiträge“ auf die Schaltfläche „Regeln bearbeiten“.
Sie werden feststellen, dass Sie Regeln für die Kategorien, Tags und Formate des Beitrags, das Veröffentlichungsdatum und die Beitrags-ID erstellen können.
Möglicherweise möchten Sie Ihren Besuchern die Suche nach bestimmten Website-Kategorien ermöglichen. Sie können Ihren Archivseiten beispielsweise eine Kategoriesuchfunktion hinzufügen, damit Ihre Besucher schnell finden, wonach sie suchen.
Um zu erfahren, wie das geht, lesen Sie Methode 1 in unserer Schritt-für-Schritt-Anleitung zur Suche nach Kategorien in WordPress.
Nachdem Sie Ihre Standardsuchmaschineneinstellungen angepasst haben, klicken Sie oben auf der Seite auf die Schaltfläche „Suchmaschinen speichern“, um Ihre benutzerdefinierte Suchmaschine zu erstellen.
Hinzufügen des Suchformulars mit Shortcode
Die SearchWP Shortcodes Extension vereinfacht das Hinzufügen Ihres neuen benutzerdefinierten Post-Suchformulars zu Ihrer WordPress-Site.
Besuchen Sie einfach die SearchWP Shortcodes-Erweiterung Website und klicken Sie dann auf die Schaltfläche „Download mit aktiver Lizenz verfügbar“.
Danach müssen Sie die Erweiterung auf die gleiche Weise installieren und aktivieren, wie Sie das Plugin oben installiert haben.
Jetzt können Sie Ihren Beiträgen, Seiten und Widgets mithilfe von Shortcodes ein benutzerdefiniertes Suchformular hinzufügen. Wenn Sie noch keine Shortcodes verwendet haben, können Sie in unserem Anfängerleitfaden mehr darüber erfahren, wie Sie einen Shortcode in WordPress hinzufügen.
Bearbeiten Sie einfach einen Beitrag und platzieren Sie Ihren Cursor dort, wo Sie das Suchformular hinzufügen möchten. Klicken Sie danach auf das Plus ‚+‚ Blocksymbol hinzufügen, um das Blockmenü aufzurufen.
Geben Sie als Nächstes „html“ in das Suchfeld ein und klicken Sie dann auf den Block „Benutzerdefiniertes HTML“, um es zum Beitrag hinzuzufügen.
Nachdem Sie den neuen Block hinzugefügt haben, sollten Sie die folgenden Shortcodes und HTML einfügen.
[searchwp_search_form engine="custom" var="searchvar" button_text="Custom Search"] <div class="search-results-wrapper"> [searchwp_search_results engine="custom" var="searchvar" posts_per_page=4] <h2>[searchwp_search_result_link direct="true"]</h2> [searchwp_search_result_excerpt] [/searchwp_search_results] </div> <div class="no-search-results-found"> [searchwp_search_results_none] No results found, please search again. [/searchwp_search_results_none] </div> <div class="search-results-pagination"> [searchwp_search_results_pagination direction="prev" link_text="Previous" var="searchvar" engine="custom"] [searchwp_search_results_pagination direction="next" link_text="Next" var="searchvar" engine="custom"] </div>
Dieser Code fügt dem Beitrag Ihr benutzerdefiniertes Suchformular hinzu, erstellt einen Abschnitt zum Anzeigen der Suchergebnisse, zeigt bei Bedarf eine Meldung ohne Ergebnisse an und fügt eine Paginierung hinzu, wenn die Ergebnisse auf mehrere Seiten gehen.
Wenn Sie Ihrer Suchmaschine einen anderen Namen gegeben haben, müssen Sie ihn ändern engine=“custom”
an vier Stellen zu Ihrem eigenen Motornamen.
Sie können den Text auf der Suchschaltfläche auch durch Bearbeiten in einen aussagekräftigeren Text ändern button_text=“Custom Search”
. Der Rest des Codes kann gleich bleiben.
Stellen Sie sicher, dass Sie auf Veröffentlichen oder Aktualisieren klicken, um Ihren Beitrag zu speichern und zu veröffentlichen.
Um das Suchformular in Aktion zu sehen, sehen Sie sich einfach den Beitrag auf Ihrer WordPress-Website an. So sieht es auf unserer Demoseite mit dem Thema Twenty Twenty-One aus.
Hinzufügen von Live-Ajax-Suche
Die Live-Ajax-Suche verbessert Ihr Suchformular, indem automatisch Dropdown-Suchergebnisse bereitgestellt werden, während der Benutzer seine Anfrage eingibt.
Der einfachste Weg, um die Ajax-Live-Suche zu WordPress hinzuzufügen, ist die kostenlose SearchWP Live Ajax Lite Search-Plugin, da es die Live-Suche automatisch aktiviert.
Eine Schritt-für-Schritt-Anleitung zur Installation finden Sie in unserer Anleitung zum Hinzufügen einer Live-Ajax-Suche zu Ihrer WordPress-Site.
Verwenden der erweiterten Einstellungen für SearchWP
Nun sollten Sie zu navigieren Einstellungen » SucheWP und klicken Sie auf die Registerkarte Erweitert. Auf dieser Seite können Sie einige Einstellungen aktivieren, die es Ihren Benutzern erleichtern, das Gesuchte zu finden.
Aktivieren Sie eine dieser Optionen, die Sie möchten:
- Bei teilweisen Übereinstimmungen werden auch Ergebnisse angezeigt, die nicht ganz mit dem gesuchten Begriff übereinstimmen.
- Automatisch „Meinten Sie?“ Korrekturen schlagen einen etwas anderen Suchbegriff vor, der mehr Beiträgen auf Ihrer Website entspricht.
- Die Unterstützung von „Suchen nach Zitaten/Phrasen“ ermöglicht es Ihren Benutzern, Anführungszeichen zu verwenden, wenn sie nach genauen Phrasen suchen.
- Durch Hervorheben von Begriffen in den Ergebnissen können Ihre Besucher in den Suchergebnissen leichter finden, wonach sie suchen.
Das Suchformular und die Ergebnisseite gestalten
Ihr WordPress-Theme steuert das Erscheinungsbild Ihrer Website, einschließlich des Suchformulars und der Suchergebnisseite. Sie speichern die Formatierungsregeln für alle Elemente Ihrer WordPress-Site in einem CSS-Stylesheet.
Sie können Ihr eigenes benutzerdefiniertes CSS hinzufügen, um die Stilregeln Ihres Themes zu überschreiben.
Wenn Sie dies noch nicht getan haben, lesen Sie unseren Artikel zum Hinzufügen von benutzerdefiniertem CSS in WordPress für Anfänger.
Hier ist beispielsweise ein benutzerdefiniertes CSS, das mit den meisten Designs funktioniert. Der erste Abschnitt ändert den Stil des Suchformulars und der zweite Abschnitt passt die Suchergebnisse an.
.searchform { font-family:arial; font-size:16px; background:#ace5e3; color:#ffffff; border:1px solid #61c3c0; padding:10px; height:90px; width:600px; } .search-results { font-family:arial; font-size:16px; background:#ace5e3; color:#000000; border:1px solid #61c3c0; padding:10px; width:600px; }
Sie können die Formatierung im Code an Ihre eigene Site anpassen. Sie können auch alle Zeilen löschen, die Sie nicht ändern möchten. Wenn Sie beispielsweise die Höhe und Breite des Suchformulars nicht ändern möchten, löschen Sie diese Zeilen einfach.
Hier sind Screenshots unserer Demo-Website vor und nach dem Hinzufügen des benutzerdefinierten CSS.
Suchergebnisse messen und Conversions verbessern
Sobald Sie Ihr benutzerdefiniertes WordPress-Suchformular eingerichtet haben, besteht der nächste Schritt darin, die Ergebnisse zu messen.
SearchWP kommt mit a Erweiterung für Suchmetriken die Ihnen genau zeigt, wie Ihre Website-Suche abschneidet.
Sie können die Suchmetriken auch verwenden, um die Suchergebnisse automatisch zu verbessern, indem Sie Ergebnisse mit mehr Klicks nach oben fördern.
E-Commerce-Websites implementieren auch Exit-Intent-Popups und gamifizierte Spin-A-Wheel-Kampagnen, um Benutzer auf Suchseiten anzusprechen, damit sie sich in E-Mail-Abonnenten und dann kurz darauf in Kunden verwandeln können.
Wir hoffen, dass dieses Tutorial Ihnen geholfen hat, ein benutzerdefiniertes WordPress-Suchformular zu erstellen. Vielleicht möchten Sie auch unsere Expertenauswahl der besten geschäftlichen Telefondienste für kleine Unternehmen und unseren Vergleich der besten Domain-Registrare sehen.