Die grundlegende Anleitung zum Hinzufügen von WordPress Breadcrumbs

Möchten Sie die Absprungraten reduzieren, die Website-Navigation verbessern, die Suchmaschinenoptimierung fördern und erstaunliche Benutzererlebnisse bieten? Natürlich tust du!

Aber wenn Sie Breadcrumbs nicht als Teil Ihrer Website verwenden, verpassen Sie eine großartige Gelegenheit. Breadcrumbs verbessern die Site-Navigation, indem sie den Benutzern helfen, einfacher durch Ihre Webseiten zu navigieren (über eine Spur von „Breadcrumbs“).

Wahrscheinlich sind Sie schon oft auf Breadcrumbs gestoßen. Sie erscheinen oft direkt unter dem Navigationsmenü einer Website.

Quelle: dedoles.se

Heute werden wir unsere besten Tipps und Tricks teilen, um Ihnen dabei zu helfen, WordPress-Breadcrumbs zu Ihrer Website hinzuzufügen und damit zu beginnen, diese Benutzererfahrungen zu verbessern.

Was sind Semmelbrösel?

Vergessen Sie golden und knusprig, frisch geröstet oder Panko. Diese Semmelbrösel mögen ach so lecker sein, aber darum geht es uns heute nicht. Nein, wir sind hier, um Online-Semmelbrösel zu diskutieren , ein insgesamt funktionellerer (und weniger essbarer) Bissen.

Ein Breadcrumb ist im Wesentlichen ein Navigationslink. Breadcrumbs sind verbunden, um einen Textpfad durch die Seiten einer Website zu erstellen. Sie verfolgen, wo sich ein Benutzer auf einer Website in Bezug auf die Startseite befindet, und befinden sich normalerweise oben, direkt unter der Navigationsleiste.

Breadcrumbs verbessern die Benutzererfahrung (UX) Ihrer Website, indem sie es Benutzern erleichtern, ihre Navigation zurückzuverfolgen. Sie unterstützen auch SEO-Rankings, indem sie Suchmaschinen helfen, durch Ihre Webseiten und Linkstrukturen zu navigieren (dazu später mehr).

Verstehen, wie die verschiedenen Breadcrumbs funktionieren

Breadcrumbs können aus verschiedenen Gründen auf eine Website angewendet werden. Für in WordPress erstellte Websites gibt es beispielsweise drei Arten von Breadcrumbs, die in die Navigation einer Website integriert werden können. Diese sind hierarchiebasiert, attributbasiert und verlaufsbasiert.

Hierarchiebasierte Breadcrumbs

Das sind Ihre klassischen Semmelbrösel. Hierarchiebasierte Breadcrumbs zeigen Website-Benutzern, wo sie sich in der Gesamtstruktur Ihrer Website in Bezug auf die Startseite befinden. Auf diese Weise können Besucher einfach durch Kategorien navigieren und verwandte Produkte finden.

Attributbasierte Breadcrumbs

Diese Breadcrumbs sind am häufigsten als Teil von E-Commerce-Websites zu finden. Attributbasierte Breadcrumbs listen die Attribute auf, nach denen ein Benutzer gesucht hat, um zu dem Produkt oder der Seite zu gelangen, die er gerade ansieht.

Stellen Sie sich zum Beispiel vor, Sie navigieren durch ein Online-Modegeschäft. Manchmal werden Sie gebeten, Ihre Suche nach Produktattributen zu verfeinern (z. B. Passform, Stil, Farbe, Größe). Die von Ihnen ausgewählten Attribute bilden Ihren Breadcrumb-Pfad.

Bildquelle

Geschichtsbasierte Breadcrumbs

Diese Breadcrumbs sind chronologisch. Sie werden basierend darauf geordnet, was Sie auf einer Website tun. Verlaufsbasierte Breadcrumbs führen Benutzer über die Seiten zurück, durch die sie bereits navigiert sind. Diese Breadcrumbs funktionieren ein wenig wie die „Zurück“-Schaltfläche Ihres Browsers, um Benutzern zu helfen, zu einer Seite zurückzukehren, die sie bereits besucht haben.

Vorteile von Semmelbröseln

Breadcrumbs sind unglaublich nützlich für die UX und SEO einer Website. Daher fördern viele Content-Marketing-Dienste die Vorteile von Breadcrumbs als Teil einer robusten Strategie für digitales Marketing.

Breadcrumbs ermöglichen es Benutzern, einfacher durch eine Website zu navigieren, und helfen Suchmaschinen-Crawlern, den Inhalt einer Website zu verstehen. Das bedeutet verbesserte Suchmaschinen-Rankings, niedrigere Absprungraten und rundum bessere Benutzererfahrungen.

Einfachere Site-Navigation für Besucher, was niedrigere Absprungraten bedeutet

Als Website-Besucher gibt es nichts Ärgerlicheres, als festzustellen, dass Sie zu einer Produktseite navigiert sind, an der Sie nicht im Geringsten interessiert sind. An diesem Punkt möchten Sie wahrscheinlich eines von zwei Dingen tun.

• Gehen Sie zurück zur Suchmaschine und fangen Sie von vorne an.
• Kehren Sie zur Startseite zurück und versuchen Sie, die gesuchte Seite zu finden.

Durch das Hinzufügen von Breadcrumbs zu Ihrer Website neigen die Benutzer weniger zum Abspringen und finden es viel einfacher, das zu finden, wonach sie suchen. Breadcrumbs ermöglichen es Website-Besuchern, ihre Benutzerreise leicht zu verfolgen und die gewünschten Seiten schnell zu finden.

Website-Crawler haben es leichter, die richtigen Seiten zu ranken

Breadcrumbs fördern die Suchmaschinenoptimierung von Websites, indem sie Suchmaschinen mitteilen, worum es auf den Seiten einer Website geht. Google verwendet tatsächlich den Namen und die Breadcrumb-Spur einer Website in Suchausschnitten, was bedeutet, dass dies eines der ersten Dinge ist, die Sie sehen, wenn Google eine Ergebnisliste anzeigt. Dies wiederum hilft den Suchenden zu sehen, wohin sie beim Klicken weitergeleitet werden.

Wenn Sie beispielsweise nach "Was sind Breadcrumbs?" In Google listen Ihre Suchergebnisse die URL, Breadcrumbs und den Titel jeder Website auf.

Drei Methoden zum Hinzufügen von Breadcrumbs zu Ihrer WordPress-Site

Wie genau gehen Sie also vor, um Ihrer WordPress-Site Breadcrumbs hinzuzufügen? Nun, es gibt ein paar verschiedene Routen, die Sie nehmen können. Wir führen Sie Schritt für Schritt durch die verschiedenen Methoden.

Wählen Sie ein WordPress-Theme aus, das bereits Breadcrumbs enthält

Der einfachste Weg, Breadcrumbs zu deiner WordPress-Seite hinzuzufügen, ist die Installation eines Themes, das sie bereits enthält. Wenn Sie einen finden, der gut zu Ihrem Branding passt und auch praktische Breadcrumbs hat, dann können Sie loslegen.

Implementieren Sie Breadcrumbs durch benutzerdefinierten Code

Eine andere Möglichkeit, Breadcrumbs zu deiner WordPress-Seite hinzuzufügen, besteht darin, sie durch benutzerdefinierten Code zu implementieren. Angenommen, Sie finden ein Thema auf WordPress , aber es enthält keine Breadcrumbs. Mit ein wenig grundlegender Programmiererfahrung können Sie sie selbst hinzufügen, indem Sie die Datei function.php für das von Ihnen gewählte Thema bearbeiten.

Folgendes müssen Sie tun:

1. Verbinden Sie WordPress über eine FTP-Site wie FileZilla FTP mit Ihrem Server .
2. Klicken Sie im FileZilla-Client auf den Ordner public_html (dies umfasst die Dateien Ihrer Website).
3. Klicke auf den Ordner wp-content.
4. Klicken Sie auf das Themenverzeichnis und wählen Sie Ihren aktuellen Themenordner aus.
5. Klicken Sie auf den Ordner functions.php und wählen Sie dann Anzeigen/Bearbeiten.
6. Fügen Sie den folgenden Code ein, um die Breadcrumb-Funktion auf Ihrer Website zu registrieren.
7. Speichern Sie die Änderungen und laden Sie die aktualisierte Datei hoch, wenn Sie dazu aufgefordert werden.

Verwenden Sie ein Plugin, um Breadcrumbs hinzuzufügen.

Eine dritte und letzte Möglichkeit, Breadcrumbs zu deiner WordPress-Seite hinzuzufügen, ist die Verwendung eines Plugins. Sie müssen dazu ein spezielles Tool wie Yoast SEO, Breadcrumb NavXT oder das WooCommerce Breadcrumbs-Plugin verwenden.

Verwenden des Yoast SEO-Plugins

Yoast ist eines der bekanntesten SEO-Plugins für WordPress und kann verwendet werden, um Breadcrumbs auf Ihrer Website zu aktivieren. Wenn Sie Yoast bereits für SEO verwenden, ist dies die beste Wahl, obwohl andere Optionen verfügbar sind (auf die wir gleich eingehen werden).

Um Semmelbrösel mit Yoast hinzuzufügen, folge diesen Schritten:

1. Installieren Sie das Yoast SEO-Plugin von Ihrem WordPress-Dashboard, dh Plugins > Neu hinzufügen > Geben Sie „Yoast“ in die Suchleiste ein > Installieren.
2. Navigieren Sie im Yoast-Plug-in zu Aussehen.
3. Klicken Sie auf den Themeneditor.
4. Wählen Sie die Vorlage namens header.php aus.
5. Fügen Sie das Code-Snippet unten ein.
6. Speichern Sie Ihre Änderungen mit einem Klick auf „Datei aktualisieren“.

Verwenden des Breadcrumb NavXT-Plugins

Eine weitere Alternative zur Verwendung von Yoast ist Breadcrumb NavXT. Dieses Plugin kann genau wie Yoast auf Ihrer Website installiert werden. Führen Sie nach der Installation einfach die folgenden Schritte aus, um Breadcrumbs zu implementieren.

1. Navigieren Sie im NavXT-Plugin zu den Einstellungen.
2. Klicken Sie auf Breadcrumb NavXT.
3. Wählen Sie aus den vier Breadcrumb-Navigationsoptionen.
4. Konfigurieren Sie das Plugin und speichern Sie die Änderungen.
5. Navigieren Sie zu Aussehen.
6. Klicken Sie auf den Themeneditor.
7. Wählen Sie die header.php-Datei aus.
8. Fügen Sie den Code unten ein.
9. Klicken Sie auf Datei aktualisieren.

Verwenden des Woocommerce Breadcrumbs-Plugins

Wenn Sie ein Woocommerce-Benutzer sind, können Sie schließlich das Woocommerce Breadcrumbs-Plugin verwenden, um Ihrer Website Breadcrumb-Funktionen hinzuzufügen.

Folgendes müssen Sie tun:

1. Installieren Sie das Woocommerce Breadcrumbs-Plugin auf Ihrer WordPress-Seite.
2. Navigieren Sie zu den Einstellungen.
3. Klicken Sie auf WC-Breadcrumbs.
4. Aktivieren Sie das Kontrollkästchen neben, um Breadcrumbs zu aktivieren.
5. Klicken Sie auf Änderungen speichern .

Quelle: fixrunner.com

Passen Sie WordPress Breadcrumbs mit CSS an

Sie können Breadcrumbs gestalten, indem Sie benutzerdefiniertes CSS anwenden, um es an den einzigartigen Stil Ihrer Website anzupassen. Wenn Sie Ihre Breadcrumbs selbst codieren, müssen Sie sich Gedanken über die Ästhetik machen, die Sie anstreben.

Dazu müssen Sie benutzerdefiniertes CSS hinzufügen, um Ihre Breadcrumbs in Ihrem vorhandenen Design-Stylesheet oder im WordPress Customizer zu gestalten. Hier können Sie Designänderungen an Ihren Breadcrumbs vornehmen, einschließlich der Anpassung von Schriftarten, Farben, Rändern, Symbolen und Rahmen.

Zwei Möglichkeiten, Breadcrumbs von Ihrer Website zu entfernen

Breadcrumbs haben offensichtliche Vorteile, wenn es darum geht, die Website-Navigation und SEO für Wachstum zu unterstützen , aber nicht jeder nimmt sie gerne auf. Wenn Sie sich entschieden haben, die Breadcrumbs Ihrer Website zu entfernen, gibt es zwei Möglichkeiten, dies zu tun.

Schalten Sie den Deaktivierungsschalter um

Die erste Möglichkeit, Breadcrumbs zu entfernen, besteht darin, einfach den Schalter in Ihrem Plugin umzuschalten, um Breadcrumbs zu deaktivieren, oder das Plugin insgesamt zu deaktivieren.

Entfernen Sie den manuell eingegebenen Code

Die andere Möglichkeit besteht darin, den manuell eingegebenen Code zu entfernen. Kehren Sie einfach zum Ordner header.php Ihrer Website zurück und löschen Sie die Codezeile, die Ihrer Website Breadcrumbs hinzufügt.

Hinterlassen Sie eine Spur aus Brotkrümeln

Breadcrumbs sind eine großartige Ergänzung für jede Website. Sie helfen Benutzern, durch Ihre Webseiten zu navigieren, und Suchmaschinen-Crawlern, um Ihre Inhalte ein bisschen besser zu verstehen.

Darüber hinaus ist die Integration von Breadcrumbs in Ihre Website ziemlich einfach. Einige WordPress-Vorlagen enthalten sogar Breadcrumbs.

Wenn Sie noch nicht panieren, worauf warten Sie noch?