Fix Shopify Breadcrumbs - data-vocabulary.org Schema veraltet

Die Warnungen waren im Januar weit verbreitet - das Schema von data-vocabulary.org ist veraltet -, die gelben Fehler in der Google Search Console und die Gefahr, dass die Suchergebnisse keine reichhaltigen Brotkrumen mehr enthalten.

Sie können testen, ob auf Ihrer Website ein Problem auftritt, indem Sie eine Unterseite mit Breadcrumb aufrufen schema.org in Googles Tests Werkzeug: https://search.google.com/structured-data/testing-tool#

Das Schema data-vocabulary.org ist veraltet. Google Search Console shopify

So beheben Sie das in Shopify Breadcrumbs veraltete Schema data-vocabulary.org

Der Breadcrumbs-Code in Shopify befindet sich im Abschnitt "Snippets" inreadcrumb.liquid:

shopify Breadcrum Snippers Dateispeicherort in admin

Der ursprüngliche Shopify-Breadcrumb-Code, den Sie höchstwahrscheinlich haben werden (wenn Sie diesen Fehler haben), enthält die folgenden Referenzen:

Eine Elementtypdeklaration, dass dies ein Breadcrumb-Schema ist:

Ein Verweis auf die URL der Seite:

Ein Verweis auf den Titel der Seite: {{'general.breadcrumbs.home' | t}}

Der einfachste Weg, diesen Code in eine akzeptable Form zu aktualisieren, ist die Verwendung des Mikrodatenschemas.

Den Beispielcode finden Sie unter die schema.org Seite hier, was zeigt, dass Sie Daten für die URL, den Titel UND die Position der Seite in der Breadcrumb-Liste benötigen:

Beispiel für Mikrodaten des Listenelementschemas

Das Ersetzen des vorhandenen Codes durch das neue Format kann je nach Thema unterschiedlich sein, aber ich werde Ihnen zuerst die allgemeinen Prinzipien geben, gefolgt von meinem Beispielcode als Referenz.

Aktualisieren Ihres Codes - Typ für Typ

Ich werde also jedes Datenfeld durchgehen, das schema.org benötigt, und feststellen, wie es geändert wurde und wie wir es in Shopify implementieren können.

1. Deklarieren der Schema.org Breadcrumb-Liste

Breadcrumbs haben normalerweise eine HTML-Formatierung für Listen. Eine geordnete Liste wird empfohlen (ist jedoch nicht erforderlich, da wir die Position verwenden).

Um das Markup zu starten, möchten wir erklären, dass wir eine Breadcrumb-Liste erstellen, indem wir alle Breadcrumb-Elemente mit diesem Code in eine übergeordnete Liste einschließen:

Und denken Sie daran, es wird ein Finishing geben Tag am Ende erforderlich.

Dies sollte in den übergeordneten Divs hinzugefügt werden, die zum Stylen verwendet werden. In meinem Beispiel ist dies:

In meinem Beispiel würde ich also das hinzufügen

Schritt 1: Fügen Sie die Breadcrumb-Referenz wie oben erwähnt in die geordnete HTML-Liste ein.

2. Entfernen einzelner Breadcrumb-Datenvokabularreferenzen

Jetzt, da alle Daten in eine Liste eingeschlossen sind, die angibt, dass es sich um eine Breadcrumb-Liste handelt, benötigen wir nicht mehr einzelne Beschriftungen für jedes Element.

In dem Github-Code, der hier von vielen verwendet wirdwird jede einzelne Seitenreferenz in das folgende div eingeschlossen:

{{collection.title}}

Jetzt können wir das entfernen Linie.

Schritt 2: Entfernen Sie die oben genannten Divs.

3. Hinzufügen jedes Listenelements

In jedem Fall, in dem wir im vorherigen Abschnitt einen DIV entfernt haben, müssen wir jetzt für jeden einen Listeneintrag hinzufügen.

Wir möchten deklarieren, dass jeder von ihnen ein Element in der übergeordneten Liste ist, und wir tun dies, indem wir sie in den folgenden Listencode einschließen:

{{collection.title}}

Wie Sie sehen können Tags umschließen die Daten der URLs.

Schritt 3: Wickeln Sie einzelne Listenelemente ein

4. Ersetzen Sie Datenetiketten durch neues Markup

Mikrodaten verwenden nicht die gleichen Bezeichnungen wie Datenvokabeln. Wir müssen die Namen für URL und Seitennamen aktualisieren.

Die alten Daten sind mit gekennzeichnet URL für die Seiten-URL und Titel für den Seitennamen:

{{collection.title}}

Wir müssen jetzt ersetzen URL mit Artikelund ersetzen Titel mit Name, Etwa so:

{{collection.title}}

Schritt 4: Ersetzen Sie die Datenbezeichnungen für URL und Titel wie oben erwähnt.

5. Position für jedes Element hinzufügen

Die letzte erforderliche Referenz in Microdata schema.org für Breadcrumbs ist die Position in der Liste für jedes Element.

Glücklicherweise gibt es in Shopify keine Unterkategorien oder Unterunterkategorien, sodass die Positionsoptionen nicht so umfangreich sind.

Sie sollten den Positionscode unmittelbar vor den schließenden / raw] -Tags in jeder Artikelliste hinzufügen. Die Homepage-Position ist immer 1, daher können Sie diese wie folgt in den oberen Referenzcode einfügen: [raw]

Die Position der Sammlungsseite ist immer 2 und die Produkt Die Seitenposition ist entweder 2 (wenn die Breadcrumbs keine Sammlung enthalten) oder 3 (wenn die Breadcrumbs eine Sammlungsreferenz enthalten).

Sie werden auf die gleiche Weise wie die Homepage-Position hinzugefügt.

Schritt 5: Fügen Sie die Position für jedes Element wie oben beschrieben hinzu

Das vollständige Beispiel Shopify Breadcrumb Code

Ich habe das hochgeladen Vollständiges Codebeispiel für Google Drive hier.

Denken Sie daran, dass dies für Ihr Thema möglicherweise nicht 100% korrekt funktioniert.

Es sollte hilfreich sein, Ihnen eine Vorstellung davon zu geben, wie die gültigen strukturierten Daten aussehen, und Ihre Vorlage entsprechend anzupassen.

Wenn Sie Hilfe bei diesem oder einem anderen benötigen SEO Fragen, dann können Sie mir eine E-Mail an [E-Mail geschützt], meine SEO-Beratung Helfen Sie Unternehmen wie Ihrem, ihren Traffic in Google und anderen Suchmaschinen zu verbessern.

Hier können Sie meine neuesten Kundenergebnisse anzeigen.

Wie nützlich war dieser Beitrag?

Klicken Sie auf einen Stern, um ihn zu bewerten!

Durchschnittliche Bewertung 4.5 / 5. Stimmenanzahl: 2

Bisher keine Stimmen! Sei der Erste, der diesen Beitrag bewertet.

Es tut uns leid, dass dieser Beitrag für Sie nicht hilfreich war!

Lasst uns diesen Beitrag verbessern!

Sagen Sie uns, wie wir diesen Beitrag verbessern können?

Matt Jackson

E-Commerce-SEO-Spezialist mit über 8 Jahren Erfahrung in der Analyse und Korrektur von Online-Shopping-Websites. Praktische Erfahrung mit Shopify, Wordpress, Opencart, Magento und anderen CMS.
Brauchen Sie Hilfe? Mailen Sie mir für weitere Informationen unter [E-Mail geschützt]

Dieser Beitrag enthält 0-Kommentare

Hinterlasse einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Pflichtfelder sind MIT * gekennzeichnet