WPLounge
Home » Tutorials » Breadcrumbs (kruimelpad) op je WordPress-website

Breadcrumbs (kruimelpad) op je WordPress-website

Een kruimelpad (breadcrumbs) laat mensen op je pagina zien waar ze zich op jouw website bevinden, en biedt een makkelijke manier om terug naar de bovenliggende pagina te gaan. Ook Google houdt ervan als je breadcrumbs gebruikt.

Affiliate disclaimer:
In onze artikelen en op onze pagina's staan affiliate links. Wanneer je via één van deze links een aankoop doet, ontvangen wij een (meestal kleine) commissie van de verkoper. Wij geven altijd onze eerlijke mening over producten. Klik hier voor meer informatie.

Op wplounge.nl gebruiken we ook een kruimelpad. Bij artikelen staat hier ook de categorie in vermeld.
Op wplounge.nl gebruiken we ook een kruimelpad. Bij artikelen staat hier ook de categorie in vermeld.

Breadcrumbs toevoegen met de WordPress SEO-plugin

Als je de plugin WordPress SEO van Yoast gebruikt, is het heel eenvoudig om breadcrumbs aan je WordPress-website toe te voegen. We raden je ook zeker aan om de plugin van Yoast hiervoor te gebruiken, want Yoast zorgter niet alleen voor dat je breadcrumbs getoond worden op je website, maar voegt ook een mooie snippet toe waardoor Google je zoekresultaten voorziet van een kruimelpad. Dat ziet er als volgt uit:

Kruimelpad in Google
Kruimelpad in Google

Om de breadcrumbs toe te voegen, ga je in de Yoast-plugin naar het tabje Interne links; hier kun je het kruimelpad activeren. Vervolgens moet je het volgende stukje code in je thema plakken, op de plek waar je de breadcrumbs wilt laten verschijnen:

TIP VAN WPLOUNGE
Divi theme & Divi Builder
Bij Elegant Themes ontvang je meer dan
85 premium themes (waaronder Divi!) voor maar 89 dollar!
Bekijk de themes »
Lees meer over Divi.

De ideale plek hiervoor is in het header.php-bestand. Zo zorg je ervoor dat het kruimelpad automatisch op iedere pagina terug komt.

In sommige WordPress-thema’s zit standaard een kruimelpad, maar vaak heeft deze niet genoeg instellingen of zorgt deze er niet voor dat je kruimelpad ook in Google zichtbaar wordt. Wil je meer controle over je breadcrumbs, verwijder dan de breadcrumbs van je thema en plak op die plek de code van Yoast.

Instellingen voor het kruimelpad

Je kunt zelf bepalen hoe je kruimelpad (breadcrumbs) eruit komen te zien. In de onderstaande afbeelding zie je welke instellingen er allemaal zijn.

Instellingen voor je breadcrumbs.
Instellingen voor je breadcrumbs.

Zoals je ziet, kun je instellen welk scheidingsteken er wordt gebruikt, en welke tekst er gebruikt moet worden voor de Home-pagina. Verder kun je een tekst instellen voor archief-pagina’s, zoekresultaten en 404-pagina’s.

Een andere handige instelling is de taxonomie die je wilt laten zien bij berichten. Wij hebben gekozen voor “Categorie”. Dit zorgt ervoor dat de categorie waarin je bericht is geplaatst ook getoond wordt in het kruimelpad. Dit is ook te zien bovenaan deze pagina. Dit artikel bevindt zich in de categorie “WordPress Tutorials“.

Je kruimelpad opmaken

Je kunt je kruimelpad ook een andere kleur geven, of de lettergrootte aanpassen. Dit doe je met behulp van CSS. De standaard “id” van de breadcrumbs is “breadcrumbs“. Om hier in de CSS-code van je thema een bepaalde opmaak aan te geven, voeg je het volgende stuk code toe aan het CSS-bestand:

Je kunt op deze manier bijvoorbeeld de lettergrootte aanpassen (in het voorbeeld hierboven is dat 12px) of de kleur aanpassen (in het voorbeeld hierboven is dat #000000, zwart). Om een andere kleur te vinden, heb je de kleurcode nodig (zes cijfers). Deze achterhaal je bijvoorbeeld op de website ColorPicker.com.

Beoordeel dit artikel

(Nog geen ratings)
Wouter Postma

Wouter Postma

Eigenaar van WPLounge. Blogt ook in het Engels op WPLounge.org.

Gratis op de hoogte blijven?

Meld je gratis aan voor onze nieuwsbrief om op de hoogte
te blijven over ontwikkelingen in WordPress!

3 reacties

  • Ik heb nog een vraag. Ik gebruik de SEO-plugin van Yoast en heb bij interne links de kruimelpad instellingen gedaan. Desondanks zie ik mijn kruimelpad als volgt: Home – subpagina i.p.v. Home – pagina – subpagina.
    Wat doe ik verkeerd? Waar kan ik instellen dat ik deze laatste weergave van het kruimelpad wil zien?

  • Ik heb eigenlijk precies dezelfde vraag als Carla.
    Hij laat alleen de home en de subpagina zien maar niet de pagina zelf.
    Dus ik zou ook graag weten waar ik deze instellingen moet veranderen

    Met vriendelijke groet,
    Paul

Advertenties

Blijf op de hoogte!