H1 Texte werden im code nicht als diese angezeigt

[lsievers]

Hallo zusammen,

wir arbeiten gerade daran, unseren Online-Shop zu verbessern und möchten dabei eine eindeutige Struktur für die Überschriften der ersten Ebene (H1) bei den Kategorien einführen. Dabei benutzen wir das "Impact Theme", bei dem wir im Backend für jede Kategorie einen Titel festgelegt haben, der als H1 formatiert sein sollte. Wenn wir uns allerdings den HTML-Code im Frontend anschauen, stellen wir fest, dass das H1-Tag für diese Überschriften fehlt.

Woran kann das liegen und wie können wir das Problem beheben, sodass der Text von Suchmaschinen als H1 erkannt wird?

Danke und viele Grüße!

[Gabe · Accepted solution]

Hey @lsievers 

Klasse Theme - Impact! Gute Wahl... 💪

Es scheint aber, als gäbe es ein Problem mit der Art und Weise, wie das "Impact Theme" in deinem Shopify-Shop die Überschriften rendert. Die Tatsache, dass im Frontend kein H1-Tag erscheint, obwohl du den Text im Backend entsprechend formatiert hast, deutet auf eine Theme-spezifische Eigenschaft. Hast du die Theme Doku durchgekämmt, oder mit den Theme Entwickler darüber gesprochen?

Du könntest versuchen, die Liquid-Template-Dateien zu überprüfen, die für die Darstellung der Kategorieüberschriften verantwortlich sind. 👀 nach, ob der Code dort korrekt das H1-Tag verwendet. Der Liquid-Code könnte etwa so aussehen und ggf. an einer anderen Stelle oder in einer anderen Liquid Datei gerendert werden:

<h1>{{ page.title }}</h1>

oder für eine Kategorie und überprüfe, ob diese Tags in der entsprechenden .liquid-Datei vorhanden sind:

<h1>{{ collection.title }}</h1>

Um dies zu überprüfen und zu korrigieren, kannst du im Quellcode der Seite (mit Rechtsklick und "Seitenquelltext anzeigen" oder in der Developer Console -> "Inspect") nachsehen, wo das H1-Tag verwendet wird, wie z. B. prüfen, ob das H1-Tag beim ersten Produkt in einer Sammlung oder am Seitenanfang erscheint. 

Es könnte auch sein, dass das Theme die H1-Überschriften durch CSS-Klassen ersetzt. Achte darauf, dass die Klasse nicht das H1-Tag in ein anderes HTML-Element umwandelt. Einige Themes verwenden auch JavaScript, um Inhalte nachträglich im DOM zu verändern. Überprüfe, ob es ein solches Skript gibt, das die H1-Elemente manipulieren könnte.

Somit ist es oft gewöhnungsbedürftig mit den Shopify Themes da sie etwas anders arbeiten als man es mit herkömmlichen Webseiten gewohnt ist. Ggf. steckt da eine gewisse Logik dahinter.

Hoffe das hilft dir weiter - lass wissen falls nicht! 😉

---
Warum nicht etwas Gamification in das Shop einbauen, um deinen Kunden etwas Fun im Shop anzubieten? Gerne kann ich bei Interesse Tipps dazu geben!

Hast du weitere Fragen zum Shop? Gebe einfach ein Suchbegriff oben in der Suchleiste der Community Landingpage ein, denn das Thema haben wir sehr wahrscheinlich schon besprochen. Halte bitte Ausschau in deiner E-Mail auf Notifications zu Antworten auf deine Fragen in der Community.

[lsievers]

Hi @Gabe ,

danke dir für die super Erklärung! Wir konnten den Themecode entsprechend anpassen und nun wird im frontend das H1 Tag angezeigt.

Viele Grüße!

[Gabe]

Super freut mich und gerne geschehen! 😉