Viele Onlineshops pflegen die gleichen Produktinformationen mehrfach: als Fließtext, in einer Icon-Leiste und noch einmal in einem Reiter. Das kostet Zeit und kann widersprüchliche Aussagen erzeugen.
Eine bessere Grundlage sind Shopify-Metafelder. Damit hinterlegst du strukturierte Daten direkt am Produkt. Ein Liquid-Snippet liest die Werte aus und zeigt nur tatsächlich gepflegte Einträge an.
Was kann in einem USP-Metafeld stehen?
Beispiele sind „Aus recyceltem Aluminium“, „Reparierbare Konstruktion“ oder „Für den Innenbereich geeignet“. Ob diese Aussagen stimmen, muss anhand der Produkteigenschaften belegt sein. Insbesondere Nachhaltigkeits- und Garantiebehauptungen sollten nicht allein aus Marketinggründen ausgegeben werden.
Metafeld im Shopify-Admin anlegen
- Öffne Einstellungen → Benutzerdefinierte Daten → Produkte. Die genaue Bezeichnung kann mit der Adminversion variieren.
- Erstelle eine neue Produkt-Metafelddefinition mit dem Namen Produktvorteile.
- Verwende den Namespace und Schlüssel custom.benefits.
- Wähle den Typ Liste von einzeiligem Text.
- Trage bei einem Testprodukt zwei oder drei echte Eigenschaften ein und speichere.
Nur wenn der Typ und der Schlüssel genau passen, funktioniert das folgende Snippet unverändert.
Wiederverwendbares Liquid-Snippet
Lege snippets/product-benefits.liquid an:
{%- comment -%}
snippets/product-benefits.liquid
Definition: custom.benefits vom Typ
"Liste von einzeiligem Text".
{%- endcomment -%}
{%- assign benefits = product.metafields.custom.benefits.value -%}
{%- if benefits != blank -%}
<div class="product-benefits">
<p class="product-benefits__heading">Produktvorteile</p>
<ul>
{%- for benefit in benefits -%}
{%- if benefit != blank -%}
<li>
<span aria-hidden="true">✓</span>
{{ benefit | escape }}
</li>
{%- endif -%}
{%- endfor -%}
</ul>
</div>
{%- endif -%}Der Zugriff erfolgt über product.metafields.custom.benefits.value. Bei einem Listen-Metafeld gibt .value eine Liste zurück; mit for können wir sie ausgeben. Wir verwenden escape, weil sich die Einträge hier auf Text beschränken.
Shopify erläutert Datentypen und den .value-Zugriff in der offiziellen Metafeld-Dokumentation.
Einbau auf der Produktseite
{% render 'product-benefits', product: product %}Platziere die Ausgabe beispielsweise im Produktinformationsbereich unter dem Preis oder neben den wesentlichen Eigenschaften. Wenn das Metafeld leer ist, wird der gesamte Block ausgeblendet – inklusive Überschrift.
Minimales CSS
.product-benefits { margin-block: 1.5rem; }
.product-benefits__heading { font-weight: 700; }
.product-benefits ul { list-style: none; padding: 0; margin: .75rem 0; }
.product-benefits li { display: flex; gap: .65rem; margin-block: .5rem; }
.product-benefits li span { color: #23764b; font-weight: 800; }Verwende im Live-Theme vorzugsweise die vorhandenen Typografie- und Spacing-Werte.
Worauf musst du achten?
- Nicht jedes Produkt hat die gleichen USPs. Genau deshalb sind produktbezogene Daten besser als eine globale, feste Werbeleiste.
- Metafelder sind Datenspeicher, keine Faktenprüfung. Prüfe technische und rechtliche Aussagen vor der Veröffentlichung.
- Produkte mit Varianten: Wenn die Eigenschaften je Variante abweichen, brauchst du statt eines Produkt-Metafelds eine Variante oder eine andere passendere Datenstruktur.
- Mehrsprachigkeit: Übersetzungen werden nicht durch die bloße Ausgabe des Standardtextes automatisch erstellt.
- Performance: Ein kurzes Liquid-Snippet verursacht normalerweise keine zusätzliche externe JavaScript-Anfrage.
Fazit
Produkt-USPs aus Shopify-Metafeldern machen Datenpflege konsistenter und eine Produktseite leichter wiederverwendbar. Die inhaltliche Wahrheit bleibt trotzdem beim Händler.
Weitere praktische Beiträge zu Shopify-CRO und Liquid-Theme-Entwicklung zeigen, wie du daraus ein sauberes Gesamtsystem machst.
War dieser Artikel hilfreich?
Dein Feedback hilft uns, unsere Ratgeber zu verbessern.
Mit Digitalhaus Kunze gearbeitet?
Dann freuen wir uns über deine ehrliche Erfahrung auf Google – unabhängig davon, ob sie positiv oder kritisch war.
Auf Google bewerten