Liquid, JavaScript, Themes
Hallo,
ich möchte generierten Json-ld Code für FAQs in Produkten und Collections einbinden, um Rich Snippets zu erhalten. Nur die Frage, wie mache ich das? z.B. in der Collection.json oder in der theme.liquid, wenn ich die einzelnen Collections und/oder Produkte anspreche?
Gelöst! Zur Lösung
Erfolg.
Man kann die if
-Bedingung in Liquid verwenden, um spezifische FAQs basierend auf der URL oder dem Namen der Sammlung einzufügen. So etwas wie das Folgende:
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": [
{% if collection.url == 'url-der-collection1' %}
{
"@type": "Question",
"name": "Frage für Collection1",
"acceptedAnswer": {
"@type": "Answer",
"text": "Antwort für Collection1"
}
}
{% elsif collection.url == 'url-der-collection2' %}
{
"@type": "Question",
"name": "Frage für Collection2",
"acceptedAnswer": {
"@type": "Answer",
"text": "Antwort für Collection2"
}
}
{% endif %}
]
}
</script>
Ersetze 'url-der-collection1' und 'url-der-collection2' durch die tatsächlichen URLs der Sammlungen und passe die Fragen und Antworten entsprechend an.
Shopify hat auch kürzlich die Unterstützung für Storefront API Metafields eingeführt, die es erlauben, benutzerdefinierte Felder zu erstellen, die man im Theme verwenden können wie ein Metafield für jede Sammlung erstellen, das den JSON-LD-Code für die FAQs enthält, und dann dieses Metafield im Theme verwenden.
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Hey @Thomas201
Danke für die Frage aber hier wären weitere Infos wichtig wie z. B. welches Theme das ist (da alle Themes unterschiedlich sind) und was du genau bis jetzt erfolglos probiert hast.
Generell gesagt, kannst du den JSON-LD (JSON for Linking Data) Code in die Vorlagen einbauen, um die Rich Snippets für FAQs hinzuzufügen. Das verbessert die Visibility der Seiten in den Suchergebnissen, da man zusätzliche Informationen enthält. Hier ein JSON-LD Code Beispiel für eine typische FAQ-Seite:
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": [{
"@type": "Question",
"name": "Was ist Ihr Rückgaberecht?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Sie können unbenutzte Produkte innerhalb von 30 Tagen nach dem Kauf zurückgeben."
}
}, {
"@type": "Question",
"name": "Bieten Sie internationalen Versand an?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Ja, wir versenden weltweit."
}
}]
}
</script>
Ändere die Inhalte von "name" und "text" entsprechend deiner FAQs und die beiden Hauptdateien sind womöglich product.liquid
und collection.liquid
für Produkt- und Sammlungsseiten.
Füge den Code vorm schließenden </head>
-Tag in den entsprechenden .liquid
-Dateien ein.
Hoffe das hilft dir weiter! 😉
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Danke @Gabe
Theme Canopy.
Die vorgeschlagene Lösung funktioniert, wenn ich immer die gleichen FAQ's haben möchte.
Bei collection1 soll aber die FAQ1 kommen, bei collection2 die FAQ2, usw.
Ich hatte die Idee, dies in die jeweilige collection.json einzufügen, oder dies in der theme.liquid zu referenzieren: if collection.url usw. - bin aber bisher gescheitert.
oder es funktioniert über Metafields..
Erfolg.
Man kann die if
-Bedingung in Liquid verwenden, um spezifische FAQs basierend auf der URL oder dem Namen der Sammlung einzufügen. So etwas wie das Folgende:
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": [
{% if collection.url == 'url-der-collection1' %}
{
"@type": "Question",
"name": "Frage für Collection1",
"acceptedAnswer": {
"@type": "Answer",
"text": "Antwort für Collection1"
}
}
{% elsif collection.url == 'url-der-collection2' %}
{
"@type": "Question",
"name": "Frage für Collection2",
"acceptedAnswer": {
"@type": "Answer",
"text": "Antwort für Collection2"
}
}
{% endif %}
]
}
</script>
Ersetze 'url-der-collection1' und 'url-der-collection2' durch die tatsächlichen URLs der Sammlungen und passe die Fragen und Antworten entsprechend an.
Shopify hat auch kürzlich die Unterstützung für Storefront API Metafields eingeführt, die es erlauben, benutzerdefinierte Felder zu erstellen, die man im Theme verwenden können wie ein Metafield für jede Sammlung erstellen, das den JSON-LD-Code für die FAQs enthält, und dann dieses Metafield im Theme verwenden.
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Hi, der obige Code funktioniert nur bis mainEntity:
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": [
]
}
</script>
Also mit Metafield probiert.
Habe ein Kategorie-Metafield mit Inhaltsart json angelegt.
Und wie geht es jetzt weiter? Meine liquid-Kenntnisse reichen leider nicht aus, um zu lösen, wie ich dieses json schema nun in den <head> der Kategorie reinbekomme.
Hey @Thomas201
Jetzt wird's etwas komplex und da empfehle ich einen unserer Experten zu konsultieren oder deine Frage in unserem technischen Leitfaden in der Englischen Community zu posten.
Um spezifische FAQs für jede Collection in Shopify einzubinden und das JSON-LD-Schema in den <head>
-Bereich der Kategorieseite einzufügen, benötigst du eine Methode, um die FAQ-Daten für jede Collection abzurufen und sie im JSON-LD-Format zu generieren.
Erstelle ein Kategorie-Metafield vom Typ JSON und stelle sicher, dass du das Metafield für die Kategorie mit dem Typ "JSON" erfolgreich erstellt hast, um die FAQs für jede Collection zu speichern. Du kannst das Metafield "faq_data" nennen oder einen passenden Namen wählen.
Um die FAQ-Daten in die Metafields einzutragen, wähle eine Collection aus und trage die FAQ-Daten in das Metafield "faq_data" ein. Die Daten sollten in einem JSON-Format ähnlich dem folgenden aussehen:
{
"questions": [
{
"name": "Frage für Collection1",
"answer": "Antwort für Collection1"
},
{
"name": "Frage für Collection2",
"answer": "Antwort für Collection2"
}
// Weitere Fragen und Antworten für andere Collections können hier hinzugefügt werden
]
}
Um den JSON-LD-Code in die theme.liquid einzufügen, müssen wir den JSON-LD-Code in die theme.liquid
-Datei einfügen, um die FAQs in den <head>
-Bereich der Kategorieseite einzubinden. Du kannst den folgenden Code verwenden:
{% if collection %}
{% if collection.metafields.faq_data %}
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "FAQPage",
"mainEntity": [
{% for faq in collection.metafields.faq_data.questions %}
{
"@type": "Question",
"name": "{{ faq.name }}",
"acceptedAnswer": {
"@type": "Answer",
"text": "{{ faq.answer | escape }}"
}
}{% unless forloop.last %},{% endunless %}
{% endfor %}
]
}
</script>
{% endif %}
{% endif %}
Dieser Code prüft zunächst, ob wir uns auf einer Kategorieseite befinden (if collection
). Dann wird überprüft, ob das Metafield "faq_data" für diese Collection existiert (if collection.metafields.faq_data
). Wenn dies der Fall ist, werden die gespeicherten FAQs im JSON-LD-Format in den <head>
-Bereich der Kategorieseite eingefügt.
Die Liquid-Tags {{ ... }}
ermöglichen es, die Werte der FAQ-Daten aus dem Metafield einzufügen. Die escape
-Filterfunktion sorgt dafür, dass die Texte korrekt formatiert und alle Sonderzeichen richtig dargestellt werden.
Speichere die Änderungen in der theme.liquid
-Datei, und die spezifischen FAQs für jede Collection sollten jetzt im JSON-LD-Format in den <head>
-Bereich der entsprechenden Kategorieseiten eingefügt werden. Dies hilft dabei, Rich Snippets für die FAQ-Daten zu erhalten und die Sichtbarkeit der Seiten in den Suchergebnissen zu verbessern.
Bei weiteren Fragen bitte einen Experten konsultieren der/die einen tieferen 👁️ in deine Metafelder und Theme Code werfen kann, was ich ja von hier aus nicht machen kann! 😉
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Hallo Gabe, danke. Ich habe die Lösung versucht. Leider meldet Googles Test für Rich-Suchergebnisse immer Feld "mainEntity" fehlt. Gibt es hier noch einen Trick?
Schwer zu sagen denn ich habe ja keine Einsicht in dein Shop und dein Theme Code. Ich arbeite ja hier blind und mit viel Guesswork.
Hast du das mit einem Experten oder Programmierer besprochen wie storeinspector.io die einen Deep-Dive indein Code machen können?
Gabe | Social Care @ Shopify
- War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen!
- Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung
- Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog
Teil 2 - Wie die Prinzipien des UX-Designs dir dabei helfen können einen großartigen Shop ...
By Kai Sep 16, 2024Teil 1 - Wie die Prinzipien des UX-Designs dir dabei helfen können einen großartigen Shop ...
By Kai Sep 9, 2024Anpassungen des benutzerdefinierten Codes an Shopify-Themes (CSS) leicht gemachtIn diesem...
By Gabe Aug 28, 2024