{"id":28989,"date":"2020-01-09T04:59:21","date_gmt":"2020-01-09T12:59:21","guid":{"rendered":"https:\/\/kinsta.com\/?p=59559"},"modified":"2023-08-11T09:36:47","modified_gmt":"2023-08-11T07:36:47","slug":"wordpress-zoekfunctie","status":"publish","type":"post","link":"https:\/\/kinsta.com\/nl\/blog\/wordpress-zoekfunctie\/","title":{"rendered":"Zo verbeter je de zoekfunctie van WordPress (en maak je hem sneller)"},"content":{"rendered":"

Waarom gebruiken mensen \u00fcberhaupt een zoekfunctie binnen een website? Omdat ze op zoek zijn naar voor hun relevante content die ze blijkbaar niet (snel genoeg) kunnen vinden door gewoon te browsen op je website.<\/p>\n

Soms levert een zoekresultaat inderdaad het juiste antwoord op de zoekopdracht van je klant<\/a> (zoals informatie over het retourbeleid van een bedrijf) of een lijst met relevante producten of content (zoals blogartikelen over pagebuilder-plugins<\/a>). Ongeacht de zoekopdracht is er \u00e9\u00e9n ding zeker:<\/p>\n

Bezoekers verwachten snelle en goede resultaten als ze zoeken op je WordPress-website.<\/strong><\/p>\n

Als je naar het online gedrag van consumenten in het algemeen kijkt, is dit eigenlijk ook niet meer dan logisch. Google heeft bijvoorbeeld een nagenoeg onhaalbare richtlijn gesteld voor wat betreft online zoeken en mensen zijn dus eigenlijk enorm verwend. Volgens SparkToro zijn inmiddels meer dan de helft van de zoekopdrachten bij Google \u201czero click<\/a>\u201d<\/u>. Dat betekent dat Google zijn zoekalgoritme zo effici\u00ebnt heeft gemaakt dat mensen meestal niet eens een website hoeven te bezoeken om een antwoord op hun vragen te krijgen.<\/p>\n

De bezoekers van jouw website verwachten natuurlijk geen zero-click resultaat. Ze gebruiken de zoekopdracht om een bepaald deel van je website te vinden. Maar een zoekopdracht bij Google<\/a> en bij WordPress hebben wel degelijk overeenkomsten: bezoekers willen snelle, gemakkelijke en bovenal superrelevante resultaten krijgen.<\/p>\n

Er is alleen \u00e9\u00e9n klein probleem. De standaard zoekfunctie van WordPress is nou niet echt om over naar huis te schrijven.<\/p>\n

Daarom leggen we in dit artikel uit wat je moet weten over het optimaliseren van de zoekfunctie van je WordPress-website<\/strong> voor jouw bezoekers.<\/p>\n

<\/div><\/kinsta-auto-toc>\n

Hoe belangrijk is een interne zoekfunctie eigenlijk?<\/h2>\n

Als je een website op de juiste manier ontwerpt<\/a> neem je je bezoekers als het ware bij de hand om ze door je website heen te leiden. Een goed georganiseerd menu<\/a> helpt daarnaast ook een boel.<\/p>\n

Desalniettemin kan een interne zoekfunctie een belangrijk hulpmiddel zijn.<\/p>\n

Zie de zoekfunctie van je site als een snel \u00e9\u00e9n-tweetje met je bezoekers. Wanneer je zoekfunctie goed werkt, kan het je bezoekers binnen enkele seconden van stap 1 naar stap 5 brengen.<\/p>\n

Dit is vooral erg prettig bij WordPress-websites met een grote hoeveelheid content. Hier wat voorbeelden:<\/p>\n

eCommerce<\/h3>\n

Webshops zoals Nordic Ware<\/a> helpen bezoekers vanaf het moment dat ze op de site komen:<\/p>\n

\"Nordic
Nordic Ware: startpagina met een zoekfunctie in de header<\/figcaption><\/figure>\n

Bezoekers worden gestuurd om naar producten te zoeken door de zoekbalk rechtsboven te gebruiken:<\/p>\n

\"Nordic
Nordic Ware: zoekresultaten<\/figcaption><\/figure>\n

Door de zoekfunctie voor producten prominent te tonen hoeven bezoekers nooit door het menu en\/of categorie\u00ebn te zoeken om een specifiek product te vinden.<\/p>\n

Blogs, podcasts en nieuwssites<\/h3>\n

Websites met een grote hoeveelheid content zoals Kinsta<\/a>, waar we nu 39 pagina’s met blogartikelen hebben, hebben zeker profijt van een zoekbalk:<\/p>\n

\"Kinsta:
Kinsta: blogpagina<\/figcaption><\/figure>\n

Door de zoekfunctie \u2013 die is afgestemd op de blogs \u2013 te gebruiken, kunnen gebruikers snel naar de onderwerpen zoeken die voor hun relevant zijn.<\/p>\n

\"WordPress
WordPress zoekbalk bovenaan de Kinsta-blog<\/figcaption><\/figure>\n

Naarmate blogs<\/a> groter worden, kan het navigeren ervan lastiger worden. Aangezien je de overzichtspagina\u2019s vanuit snelheidstechnisch oogpunt kort wil houden, is het een slecht idee om meer artikelen per pagina te laten zien.<\/p>\n

Je kunt dan beter een zoekbalk gebruiken om bezoekers te helpen bij het vinden van voor hun interessante artikelen.<\/p>\n

Advertentie-websites<\/h3>\n

Op websites die advertenties verzamelen<\/a> (denk aan verkoop of verhuur van huizen, Marktplaats, professionele diensten) is ergens naar zoeken meestal het eerste wat bezoekers doen. Zie bijvoorbeeld Trulia<\/a>:<\/p>\n

\"Trulia:
Trulia: zoeken op de startpagina naar huizen<\/figcaption><\/figure>\n

Het is cruciaal dat het zoekproces op deze sites eenvoudig is en bovendien goed werkt. Zoek bijvoorbeeld op een locatie, een naam, of een functie. Vervolgens kunnen gebruikers op de resultatenpagina de resultaten verder filteren:<\/p>\n

\"Trulia:
Trulia: voorbeeld van een resultatenpagina<\/figcaption><\/figure>\n

Kenniswebsites<\/h3>\n

Een zoekfunctie is vooral erg handig voor hulpwebsites of kenniswebsites voor producten, zoals Elementor<\/a>:<\/p>\n

\"Elementor:
Elementor: onderwerpen en tellers bij de kennisbank<\/figcaption><\/figure>\n

Een zoekfunctie helpt om bezoekers sneller antwoorden op hun vragen te vinden dan wanneer ze handmatig zouden zoeken:<\/p>\n

\"Elementor:
Elementor: de documentatie doorzoeken op “template”<\/figcaption><\/figure>\n

In veel gevallen kunnen gebruikers van SaaS-producten<\/a> hun problemen zelf oplossen. Als je dus wil zorgen dat je live chat<\/a> en helpdesk niet bestookt worden met makkelijkere, dan moet je je site zo instellen dat mensen makkelijk antwoorden kunnen vinden in je kennisbank.<\/p>\n

Conclusie<\/h3>\n

Als je ergens een grote hoeveelheid van hebt op je website, denk dan niet dat je navigatie<\/a> er wel voor zorgt dat je bezoekers kunnen vinden wat ze zoeken. Het bouwen van een zoekfunctie zoals de Fast Pass helpt ze om snel antwoorden te vinden.<\/p>\n

Hoe voeg je de zoekfunctie toe aan je WordPress-website<\/h2>\n

Je hebt verschillende mogelijkheden om een eenvoudige zoekfunctie op je WordPress-website te implementeren:<\/p>\n

Het toevoegen van een zoekfunctie aan je menu, via je thema<\/h3>\n

Afhankelijk van het WordPress-thema dat je hebt ge\u00efnstalleerd<\/a>, kun je wellicht met een paar klikken een zoekfunctie toevoegen aan je website. In dit voorbeeld gebruik ik het Astra thema<\/a>, die overigens erg snel blijkt te zijn<\/a>!<\/p>\n

Het eerste wat je doet is naar Weergave > Customizer te gaan:<\/p>\n

\"WordPress
WordPress – navigeer naar het Customize menu<\/figcaption><\/figure>\n

Daarna ga je naar Header> Primary Menu.<\/p>\n

\"WordPress
WordPress – pas het menu aan<\/figcaption><\/figure>\n

Onder “Last Item in Menu”, selecteer je “Search” in het dropdownmenu.<\/p>\n

\"WordPress
WordPress – voeg een zoekbalk toe aan je menu<\/figcaption><\/figure>\n

Dit voegt een zoekicoontje en zoekbalk toe aan als het laatste element in je menu.<\/p>\n

\"WordPress
WordPress – zoekbalk toegevoegd via de thema-instellingen<\/figcaption><\/figure>\n

Wanneer je andere WordPress-thema’s<\/a> gebruikt, vind je deze instellingen wellicht op een andere plek. Als het beschikbaar is, vind je het meestal onder de instellingen van de “Header”. Het alternatief is handmatig een zoekfunctie toevoegen via de hieronder beschreven opties.<\/p>\n

Voeg de zoekfunctie toe met een WordPress-widget<\/h3>\n

WordPress widgets<\/a> maken het mogelijk om functies en content toe te voegen op plekken naast, boven en onder je daadwerkelijke content. Denk bijvoorbeeld aan de zijbalk<\/a> en de footer<\/a>.<\/p>\n

Een voorbeeld van zo’n contentblok is dus een zoekbalk.<\/p>\n

Begin door Widgets te vinden in het Weergave-menu.<\/p>\n

\"WordPress-
WordPress- vindt het Widgets-menu<\/figcaption><\/figure>\n

Hier vind je alle beschikbare widgets. Afhankelijk van het thema of sjabloon dat je gebruikt, zie je hier misschien alleen maar een zijbalk of footer, of een meer uitgebreide selectie:<\/p>\n

\"Voorbeeld
Voorbeeld van widgets<\/figcaption><\/figure>\n

Je moet nu beslissen waar je je zoekbalk wilt hebben.<\/p>\n

Stel dat je van plan bent elke dag nieuwe content voor je blog<\/a> te publiceren, dan weet je dus dat je archief snel zal groeien. Dan is het verstandig om op elke blogpagina een zoekbalk te hebben.<\/p>\n

Scroll helemaal naar onder bij je widgets en selecteer de “Zoeken”-widget.<\/p>\n

\"Search
Search widget<\/figcaption><\/figure>\n

Je kunt er direct op klikken en kiezen waar je de zoekbalk wilt hebben:<\/p>\n

\"Toevoegen
Toevoegen van een Search-widget via het dropdown menu.<\/figcaption><\/figure>\n

Je kunt de widget ook naar het element slepen waar je het wilt gaan laten zien.<\/p>\n

\"Toevoegen
Toevoegen van de Search-widget door te slepen.<\/figcaption><\/figure>\n

Als je de widget hebt waar je ‘m hebben wilt, geef je de widget een naam:<\/p>\n

Geef de Search-widget een titel<\/figcaption><\/figure>\n

Sla de veranderingen op en bezoek je website om te checken dat alles er goed uitziet.<\/p>\n

\"Zoekbalk
Zoekbalk toegevoegd aan het blog<\/figcaption><\/figure>\n

Je kunt de zoekbalk nu bovenaan het blog zien, waar je lezers het meteen kunnen gebruiken.<\/p>\n

Toevoegen van een zoekfunctie aan de content van je websites via WordPress-tools<\/h3>\n

Alhoewel het soms handig is dat je bezoekers altijd toegang tot de zoekfunctie hebben, kan het ook zijn dat je de zoekfunctie liever in de content van je pagina’s hebt.<\/p>\n

Er zijn een paar manieren om dat te doen:<\/p>\n

Met de WordPress-Editor<\/h4>\n

De Gutenberg Editor<\/a> heeft het veel makkelijker gemaakt om een pagina te ontwerpen, zonder dat je HTML<\/a> of shortcodes<\/a> hoeft te gebruiken.<\/p>\n

E\u00e9n van de elementen die je hier mee kunt toevoegen aan je pagina’s is een search-widget:<\/p>\n

\"Search-widgetblock
Search-widgetblock in Gutenberg<\/figcaption><\/figure>\n

Als je deze methode gebruikt heb je meer controle over hoe de zoekbalk er precies uitziet. Zo kun je de titel van de zoekbalk veranderen, de tekst van de placeholder en de zoekknop:<\/p>\n

\"Aanpassen
Aanpassen van je zoekbalk via Gutenberg<\/figcaption><\/figure>\n

Je kunt zelfs de stijl van het zoekblok aanpassen via aanpasbare CSS-classes<\/a>.<\/p>\n

Met een pagebuilder-plugin<\/h4>\n

Mensen die liever werken met een drag-and-drop-plugin zoals Elementor, kunnen de search-widget toevoegen via die plugin. Het proces lijkt erg op dat van Gutenberg.<\/p>\n

Met een nieuwe pagina of artikel open en de Elementor-editor geactiveerd, zoek je op de WordPress search-widget binnen je elementenlijst:<\/p>\n

\"Search-widget
Search-widget in Elementor<\/figcaption><\/figure>\n

Sleep het zoek-element naar waar je het op de pagina wilt hebben. Dit is bijvoorbeeld een 404-pagina<\/a> die gebruikers een zoekbalk biedt om alsnog op de juiste plek uit te komen.<\/p>\n

\"Voorbeeld
Voorbeeld van een 404-pagina met zoekbalk<\/figcaption><\/figure>\n

Zoals je kunt zien geeft een page builder-plugin je meer controle dan de Gutenberg-editor over waar de zoekbalk precies verschijnt.<\/p>\n

Met een thema<\/h4>\n

Soms zul je ook een thema of sjabloon vinden dat direct een zoekfunctie toevoegt aan de content van je website. Maar het type thema dat dit automatisch doet is vaak erg gespecialiseerd, zoals het Residence Real Estate thema<\/a>:<\/p>\n

\"Demo
Demo van het Residence Real Estate thema<\/figcaption><\/figure>\n

Aangezien het zoeken op dit soort advertentie-websites<\/a> al snel ingewikkeld wordt, is het logisch dat de ontwikkelaar van het thema<\/a> de zoekfunctionaliteit meteen bij het sjabloon inbouwt<\/a>.<\/p>\n

Boekingswebsites zijn nog zo’n voorbeeld van thema’s met ingebouwde zoekfuncties, zoals deze demo van het Travel Booking thema<\/a>:<\/p>\n

\"Demo
Demo van het Travel Booking thema<\/figcaption><\/figure>\n

Het scheelt natuurlijk een hoop als er al zoekfunctionaliteit in je WordPress-thema is ingebouwd. En als het thema ook geoptimaliseerd is voor prestaties<\/a>, dan zal je dit ook terugvinden in de zoekfunctie<\/a> – weer een probleem minder dus.<\/p>\n

Toevoegen van een WordPress zoekfunctie via code<\/h3>\n

Je kunt de zoekfunctionaliteit ook toevoegen aan je website door het er zelf in te programmeren. En vrees niet, het is eigenlijk heel simpel!<\/p>\n

Dit doe je door naar Weergave > Editor te gaan<\/p>\n

\"How
Theme Editor<\/figcaption><\/figure>\n

Hier maak je een shortcode aan voor een zoekbalk door middel van het themabestand functions.php:<\/p>\n

\"Het
Het functions.php thema-bestand<\/figcaption><\/figure>\n

Onderaan dit bestand voeg je het volgende stukje code toe:<\/p>\n

add_shortcode( 'shortcodename', 'get_search_form');<\/code><\/pre>\n
Vervang “naamshortcode” met je eigen titel voor het zoekformulier. Zorg dat het alleen kleine letters bevat, geen spaties, cijfers of symbolen. Als je het bestand vervolgens updatet, kun je de shortcode op je website gaan gebruiken.<\/p>\n
Hier is een voorbeeld:<\/p>\n
\"Een
Een aangepaste shortcode om een zoekbalk toe te voegen aan je website<\/figcaption><\/figure>\n
De shortcode voeg je op dezelfde manier toe zoals je normale tekst zou toevoegen. Onthoud wel dat je het moet afsluiten met rechte haken [ ].<\/p>\n
Alhoewel je de zoekbalk niet in je editor zult kunnen zien, kun je een preview van je website bekijken om het in je front-end te zien:<\/p>\n
\"Zoekbalk
Zoekbalk toegevoegd d.m.v. shortcode<\/figcaption><\/figure>\n
Let op: ook al is dit maar een kleine bewerking aan je thema \u2013 en volstaat deze korte uitleg voor dit artikel – is het altijd beter om een child-thema<\/a> aan te maken en daar de codewijzigingen aan toe te voegen dan de code van je thema rechtstreeks aan te passen.<\/p>\n
Een opmerking over de beperkingen van de WordPress zoekfunctionaliteit<\/h3>\n
Je hebt nu wel in de gaten dat er legio mogelijkheden zijn om de eenvoudige zoekfunctionaliteit van WordPress toe te voegen aan je website. Maar is deze zoekfunctie wel voldoende?<\/p>\n
Helaas is het antwoord enigszins teleurstellend. Tenzij je een hele kleine website hebt of je kan leven met beperkte zoekfunctionaliteiten, is deze basisfunctionaliteit waarschijnlijk te beperkt. Laat me dat even toelichten.<\/p>\n
De standaard zoekfunctie van WordPress zoekt door de volgende typen content binnen je blogartikelen en webpagina’s:<\/p>\n