Ein Besucher landet auf Ihrer Website, liest einen Artikel und möchte zur übergeordneten Kategorie zurückkehren. Ohne Navigation betätigt er die „Zurück"-Schaltfläche des Browsers und verlässt die Seite. Für den Seitenbetreiber ist das ein verlorener Seitenaufruf; für SEO ist es ein Signal, dass der Inhalt den Nutzer nicht gehalten hat.

Breadcrumbs lösen dieses Problem mit einer einzigen Navigationszeile. Sie zeigen den Pfad von der Startseite zur aktuellen Seite, helfen Google, Ihre Seitenstruktur zu verstehen, und tragen unmittelbar zu niedrigeren Absprungraten bei. Die Einbindung in WordPress dauert etwa zehn Minuten, selbst wenn Sie noch nie Theme-Code bearbeitet haben.

Nachfolgend finden Sie eine Schritt-für-Schritt-Anleitung, die alles abdeckt, vom Verständnis der Breadcrumb-Typen bis zum Einfügen von einsatzbereitem Code in Ihr Template. Ohne überflüssigen Ballast, mit echten Screenshots und bewährten Plugins.

💡 Kurzer Überblick:

• Lernen Sie die vier Breadcrumb-Typen kennen und wählen Sie den aus, der zu Ihrer Seitenstruktur passt
• Fügen Sie Breadcrumbs über Yoast SEO (die gängigste Methode) oder Breadcrumb NavXT (maximale Flexibilität) hinzu
• Richten Sie strukturierte Daten nach Schema.org ein; ohne diese zeigt Google keine Breadcrumbs in den Suchergebnissen an

Was sind Breadcrumbs

Breadcrumbs sind eine Navigationsspur, die Nutzern ihre aktuelle Position innerhalb der Hierarchie einer Website anzeigt. Der Name bezieht sich auf das Märchen von Hänsel und Gretel, in dem die Kinder Brotkrumen auslegten, um den Weg nach Hause zu finden. Im Web funktioniert dieser Mechanismus genauso: Eine Kette von Links führt von der aktuellen Seite zurück zur Startseite.

Das Standardformat für Breadcrumbs verwendet das Trennzeichen > zwischen den Ebenen. Liest ein Besucher beispielsweise einen Artikel über URL-Struktur im Bereich „WordPress Tutorial", sieht er: Home > WordPress Tutorial > URL-Struktur in WordPress. Die Spur wird üblicherweise oberhalb des Inhalts platziert, seltener am Ende.

Technisch gesehen ist jedes Element ein Link zur entsprechenden Ebene der Hierarchie. Das letzte Element (die aktuelle Seite) ist in der Regel nicht anklickbar, da sich der Nutzer bereits dort befindet. Für Suchmaschinen wird diese Spur zu strukturierten Daten gemäß dem BreadcrumbList-Standard von Schema.org.

Arten von Breadcrumbs

Websites nutzen vier Arten von Navigationsspuren. Die Wahl hängt von Ihrer Seitenarchitektur und den Nutzungsszenarien ab.

Standortbasiert

Der häufigste Typ. Er zeigt die aktuelle Position des Nutzers innerhalb der Baumstruktur der Website. Das obige Beispiel ist ein standortbasierter Breadcrumb. Dieser Typ ist besonders nützlich für Seiten mit tiefen Hierarchien: Onlineshops, Dokumentationsportale und Nachrichtenportale. Nutzer erkennen stets, in welchem Bereich sie sich befinden, und können mit einem Klick eine Ebene nach oben wechseln.

Attributbasiert

Wird vor allem auf E-Commerce-Seiten eingesetzt. Statt eines festen Pfads werden aktive Produktfilter angezeigt. Die Struktur sieht so aus: Home > Mobiltelefone > Apple > iPhone 15 > 128 GB > Schwarz. Jedes Attribut ist ein anklickbarer Filter, über den Nutzer ihre Auswahl schnell zurücksetzen können. Praktisch für Kataloge mit dutzenden Filterparametern.

Verlaufsbasiert

Zeigt die Route an, die der Nutzer seit Betreten der Website genommen hat. Er dupliziert im Wesentlichen die „Zurück"-Schaltfläche des Browsers, weshalb dieser Typ selten verwendet wird. UX-Designer bevorzugen die standardmäßige Browser-Navigation: Sie ist vertrauter und überfrachtet die Oberfläche nicht.

Pfadbasiert

Ein hybrider Typ, der den Besuchsverlauf mit einem attributbasierten Ansatz kombiniert. Struktur: Zurück zum Vorherigen > Kategorie > Farbe > Größe. Dieser Typ ist selten und findet sich hauptsächlich in Nischen-Interfaces, bei denen die Kombination von Kontext und Pfad wichtig ist.

Warum Ihre Website Breadcrumbs benötigt

Google nutzt Breadcrumbs für zwei Zwecke: zum Verständnis der Seitenstruktur und zur Darstellung der Navigationsspur direkt in den Suchergebnissen. Statt einer bloßen URL sehen Nutzer einen lesbaren Pfad: techblog.sdstudio.top > WordPress > Plugins. Das erhöht die Klickrate des Snippets, da Besucher bereits vor dem Klick erkennen, wo sich die Seite befindet.

Aus UX-Sicht lösen Breadcrumbs zwei Probleme. Erstens die Orientierung: Nutzer sehen sofort ihren Standort auf der Website und fühlen sich nicht verloren. Zweitens die Navigation: Der Wechsel in einen übergeordneten Bereich erfordert nur einen Klick, ohne die Zurück-Schaltfläche des Browsers zu bemühen. Das Ergebnis sind niedrigere Absprungraten und eine höhere Seiten-Tiefe.

Ein wichtiger Hinweis: Breadcrumbs ersetzen nicht das Hauptmenü. Sie ergänzen es als sekundäres Navigationsmittel für Seiten der zweiten und dritten Ebene. Auf der Startseite werden sie üblicherweise nicht angezeigt.

So fügen Sie Breadcrumbs in WordPress hinzu

Es gibt mehrere Hauptmethoden: über ein SEO-Plugin, über ein spezialisiertes Navigations-Plugin oder manuell per Code. Die erste Methode ist die einfachste und deckt die meisten Anwendungsfälle ab. Die zweite ist für diejenigen, die eine fein abgestimmte Kontrolle benötigen. Die dritte ist für Entwickler.

Methode 1. Yoast SEO

Das beliebteste WordPress-SEO-Plugin enthält ein integriertes Breadcrumb-Modul. Es ist standardmäßig deaktiviert; Sie müssen eine Zeile in Ihrem Theme-Template ergänzen.

Kopieren Sie den unten stehenden Code und fügen Sie ihn in single.php, page.php oder header.php Ihres Themes ein. Fügen Sie ihn nicht in functions.php ein, da dies beim Aktualisieren des Themes zu Konflikten führen kann.

1
<?php
2
if (function_exists('yoast_breadcrumb')) {
3
    yoast_breadcrumb('<p id="breadcrumbs">', '</p>');
4
}
5
?>

Nach dem Einfügen des Codes gehen Sie ins Admin-Panel: Yoast SEO** → Einstellungen → Erweitert → Breadcrumbs**. Setzen Sie den Schalter „Breadcrumbs für Ihr Theme aktivieren" auf die aktive Position.

Im selben Abschnitt können Sie das Trennzeichen, das Präfix für die Startseite und die Taxonomie-Zuordnungen für benutzerdefinierte Beitragstypen konfigurieren. Yoast generiert automatisch BreadcrumbList-Strukturdaten, sodass keine weiteren Schritte erforderlich sind.

Methode 2. Breadcrumb NavXT

Wenn Yoast nicht installiert ist oder Sie eine flexiblere Konfiguration benötigen, gibt Ihnen Breadcrumb NavXT die volle Kontrolle über Aussehen und Verhalten des Navigationspfads. Das Plugin wird aktiv gepflegt: Version 7.5.1 (Dezember 2025) hat die Schwachstelle CVE-2025-13842 geschlossen, stellen Sie daher sicher, dass Sie die neueste Version installieren.

Installieren Sie das Plugin aus dem Breadcrumb NavXT-Repository, aktivieren Sie es und gehen Sie zu Einstellungen → Breadcrumb NavXT.

Konfigurieren Sie die Breadcrumb-Vorlagen passend zu Ihrer Struktur. Fügen Sie anschließend den Funktionsaufruf in Ihr Theme-Template ein:

1
<div class="breadcrumbs" typeof="BreadcrumbList" vocab="https://schema.org/">
2
    <?php if (function_exists('bcn_display')) {
3
        bcn_display();
4
    } ?>
5
</div>

Das Plugin unterstützt Schema.org-Strukturdaten standardmäßig und funktioniert mit WPML, Polylang, bbPress und BuddyPress. Zur Ausgabe per Widget: Design → Widgets, ziehen Sie „Breadcrumb Trail" in den gewünschten Bereich.

Methode 3. Rank Math SEO

Eine Alternative zu Yoast mit integrierten Breadcrumbs. Nach der Installation von Rank Math gehen Sie zu Rank Math** SEO → Allgemeine Einstellungen → Breadcrumbs**. Aktivieren Sie die Option und fügen Sie den Shortcode [rank_math_breadcrumb] an der gewünschten Stelle in Ihrem Template ein. Die Funktionsweise ähnelt Yoast: automatische Strukturdaten und flexible Darstellungseinstellungen.

Methode 4. Integrierte Theme-Funktionalität

Einige Themes (GeneratePress, Astra Pro, Kadence) enthalten Breadcrumbs in den Customizer-Einstellungen. Prüfen Sie Design → Customizer → Layout → Breadcrumbs; möglicherweise benötigen Sie gar kein Plugin.

Testen und Debugging

Nachdem Sie den Code hinzugefügt haben, überprüfen Sie die Ergebnisse an zwei Stellen. Erstens: Öffnen Sie eine beliebige interne Seite Ihrer Website, der Navigationspfad sollte oberhalb der Überschrift oder unterhalb des Headers erscheinen. Zweitens: Führen Sie den Rich Results Test von Google aus, geben Sie die Seiten-URL ein und bestätigen Sie, dass das Element „BreadcrumbList" fehlerfrei erkannt wird.

Wenn die Breadcrumbs nicht erscheinen, prüfen Sie, ob die Template-Datei, in die Sie den Code eingefügt haben, tatsächlich für diese Seite verwendet wird. In manchen Themes wird single.php durch singular.php oder Blöcke im Site Editor (FSE) überschrieben. Verwenden Sie bei Block-Themes das Breadcrumb NavXT-Widget oder den Rank Math-Shortcode.

⁉️🤔 Häufig gestellte Fragen

Beeinflussen Breadcrumbs das Google-Ranking?

Nicht direkt. Breadcrumbs sind kein offizieller Rankingfaktor. Sie wirken jedoch indirekt: Google zeigt Breadcrumbs im Snippet statt der URL an, was die Sichtbarkeit erhöht und die Klickrate verbessert. Zudem helfen BreadcrumbList-Strukturdaten Suchmaschinen, Ihre Seitenarchitektur präziser zu verstehen, was sich auf die Indexierung tiefer Seiten auswirkt. Seiten mit Breadcrumbs weisen im Vergleich zu ähnlichen Seiten ohne diese typischerweise eine 5-10% niedrigere Absprungrate auf.

Kann ich Breadcrumbs ohne Plugin einbinden?

Ja. Fügen Sie eine Funktion in functions.php ein, die den Pfad auf Basis von wp_get_nav_menu_items() oder der Kategoriehierarchie erstellt. Rufen Sie diese dann in Ihrem Template auf. Der Nachteil des manuellen Ansatzes: Sie müssen die Schema.org-Strukturdaten selbst generieren, Sonderfälle behandeln (Startseite, 404, Anhänge) und den Code bei Änderungen der Seitenstruktur anpassen. Für die meisten Projekte ist ein Plugin schneller und zuverlässiger.

Welches Trennzeichen ist am besten: >, / oder →?

Das Trennzeichen > ist der De-facto-Standard. Es liest sich intuitiv als „eine Ebene tiefer gehen" und wird von Google in den Suchergebnissen verwendet. Das /-Symbol ist optisch leichter, kann aber mit URLs verwechselt werden. Der →-Pfeil sieht für Designer ansprechender aus, wird von Google in Strukturdaten jedoch möglicherweise nicht erkannt. Empfehlung: Verwenden Sie > für maximale Kompatibilität.

Ist es notwendig, Breadcrumbs auf mobilen Geräten anzuzeigen?

Der Platz auf dem Bildschirm ist bei mobilen Geräten begrenzt, doch Breadcrumbs sind dort sogar noch nützlicher. Smartphone-Nutzer sehen kein Seitenleistenmenü, sodass Breadcrumbs die einzige schnelle Möglichkeit werden, in der Hierarchie nach oben zu navigieren. Die meisten Themes passen den Pfad automatisch für mobile Geräte an: Sie reduzieren die Schriftgröße und kürzen Zwischenebenen auf ein Format wie „... > Aktuell".

Was ist, wenn meine Website eine benutzerdefinierte URL-Struktur verwendet?

Breadcrumb NavXT erlaubt es Ihnen, die Hierarchie für benutzerdefinierte Beitragstypen und Taxonomien manuell festzulegen. Gehen Sie in den Plugin-Einstellungen zum Tab Beitragstypen und wählen Sie die übergeordnete Taxonomie für jeden CPT aus. Verwenden Sie für stark vom Standard abweichende Fälle den Filter bcn_breadcrumb_trail, der Ihnen volle Kontrolle über jedes Element im Pfad gibt.

Sollten Sie 2026 Breadcrumbs einbinden

Unbedingt. Dies ist kein Trend oder Experiment, sondern ein über Jahre bewährtes Navigationsmuster, das die UX verbessert und indirekt die SEO unterstützt. Der Implementierungsaufwand beträgt zehn Minuten für die Installation eines Plugins und das Einfügen einer Codezeile. Der Ertrag ist eine klare Navigation für Besucher und saubere Snippets in den Google-Suchergebnissen.

Wenn Sie bereits Yoast SEO oder Rank Math installiert haben, sind Sie buchstäblich zwei Klicks vom fertigen Ergebnis entfernt. Falls nicht, deckt Breadcrumb NavXT Ihre Anforderungen mit reichlich Flexibilität ab. Wählen Sie die Methode, die zu Ihrem Stack passt, und binden Sie noch heute Breadcrumbs ein: Ihre Besucher werden es Ihnen still durch niedrigere Absprungraten und eine längere Verweildauer danken.