Allgemeines Werkzeug / 33

Shopify SEO Meta-Tag & SERP-Vorschau Generator

Erstelle suchoptimierte Shopify-Titel-Tags und Meta-Beschreibungen mit SERP-Vorschau nach Pixelbreite, wiederverwendbarem Liquid und statischer HTML-Ausgabe.

Shopify SEO Meta-Tag & SERP-Vorschau Generator: TOEA schätzt die Breiten von Titel und Beschreibung (~600px und ~960px als Desktop-Grenzen) und erstellt anschließend ein seitentypbezogenes Liquid-Snippet, das beim Rendern Shopify-Objekte ausliest. Der statische HTML-Bereich ist eine Vorschau der hier eingegebenen Werte, kein themeweiter Ersatz. Läuft zu 100% lokal in deinem Browser, ohne Datei-Uploads zum Server.

Kategorie: Web‑Werkzeuge
Ausführungen: In deinem Browser
Kosten: Kostenlos · ohne Anmeldung
Verfügbarkeit: Einsatzbereit

Shopify-Seite & Meta-Details

Seitentyp

Seitentitel

Shopify-Shopname

Meta-Beschreibung

Fokus-Keyword

Preis (nur Produkt)Nur für die statische Produktvorschau verwendet.

Währung

Live-Vorschau der Google-SERP-Karte

https://apexcoffeeroasters.myshopify.com› products ›handwerklich-ger-stete-bio-espressobohnen

Handwerklich geröstete Bio-Espressobohnen | Apex Coffee Roasters

US$24.99 • Entdecke unsere in kleinen Chargen lokal gerösteten Bio-Espressobohnen mit Noten von dunkler Schokolade und Haselnuss. Bestelle jetzt frischen Kaffee online!

Pixelbreite des Titels500px / 600px

64 Zeichen ✓ Innerhalb der Titelbreite

Breite der Meta-Beschreibung912px / 960px

157 Zeichen ✓ Optimale Snippet-Länge

Shopify-Liquid-Meta-Snippet

{% comment %} Shopify SEO Tags — reusable product output. Render this snippet from layout/theme.liquid <head> and remove overlapping title/meta tags. Values come from Shopify objects, not this preview. {% endcomment %}
{% if request.page_type == 'product' and product %}
{% assign seo_title = page_title | default: product.title %}
{% assign seo_description = page_description | default: product.description | strip_html %}
{% assign seo_og_type = 'product' %}
<title>{{ seo_title | escape }}{% if shop.name != blank and seo_title != shop.name %} | {{ shop.name | escape }}{% endif %}</title>
{% if seo_description != blank %}<meta name="description" content="{{ seo_description | escape }}" />{% endif %}

<meta property="og:site_name" content="{{ shop.name | escape }}" />
<meta property="og:type" content="{{ seo_og_type | escape }}" />
<meta property="og:title" content="{{ seo_title | escape }}" />
<meta property="og:description" content="{{ seo_description | escape }}" />
{% if product.selected_or_first_available_variant.price != blank %}
<meta property="og:price:amount" content="{{ product.selected_or_first_available_variant.price | money_without_currency | strip_html | escape }}" />
<meta property="og:price:currency" content="{{ cart.currency.iso_code | default: shop.currency | escape }}" />
{% endif %}
{% endif %}

Ausgabe der statischen HTML-Vorschau

<!-- Static preview only; use the Liquid output for theme templates. -->
<title>Handwerklich geröstete Bio-Espressobohnen | Apex Coffee Roasters</title>
<meta name="description" content="Entdecke unsere in kleinen Chargen lokal gerösteten Bio-Espressobohnen mit Noten von dunkler Schokolade und Haselnuss. Bestelle jetzt frischen Kaffee online!" />
<meta property="og:site_name" content="Apex Coffee Roasters" />
<meta property="og:type" content="product" />
<meta property="og:title" content="Handwerklich geröstete Bio-Espressobohnen | Apex Coffee Roasters" />
<meta property="og:description" content="Entdecke unsere in kleinen Chargen lokal gerösteten Bio-Espressobohnen mit Noten von dunkler Schokolade und Haselnuss. Bestelle jetzt frischen Kaffee online!" />
<meta property="og:price:amount" content="24.99" />
<meta property="og:price:currency" content="USD" />

Wo Shopify diese Tags bereits schreibt

Die meisten Themes, einschließlich Dawn und der zahlreichen darauf basierenden Themes, geben Titel, Meta-Beschreibung und Open-Graph-Tags bereits über layout/theme.liquid und ein Snippet wie meta-tags.liquid aus. Wenn du dieses Snippet zusätzlich einfügst, entstehen zwei Titel und zwei Beschreibungen. Kommentiere die eigenen Tags des Themes für die Seitentypen aus oder entferne sie, die das Snippet abdeckt. Rufe anschließend den Seitenquelltext auf, um zu bestätigen, dass nur jeweils ein Tag übrig bleibt.

Titel und Beschreibungen aus dem Adminbereich

Shopifys Adminbereich enthält für jedes Produkt, jede Kollektion und jede Seite einen Abschnitt für den Sucheintrag. Liquid stellt diese Werte als page_title und page_description bereit. Das Snippet liest diese Werte zuerst aus. Ein im Adminbereich manuell verfasster Eintrag wird daher von Suchmaschinen gesehen; bleibt er leer, werden Titel und Beschreibung des Elements verwendet. Wenn du den Eintrag später änderst, musst du nur den Adminbereich bearbeiten, nicht das Theme. Die Zähler im Adminbereich erlauben 70 Zeichen für den Titel und 320 für die Beschreibung – mehr, als auf einer Ergebnisseite angezeigt wird. Verfasse den Eintrag daher anhand der Pixelanzeigen hier.

Eine Produktbeschreibung kann deutlich länger als ein Snippet sein, und Suchmaschinen kürzen sie einfach ab. Prüfe die Ausgabe mit dem Meta-Tag-Prüfer, sobald sie live ist.

So benutzt du es

Wähle Product, Collection oder Page und gib dann Titel, Shop-Name, Beschreibung und Fokus-Keyword ein.
Prüfe die seitenspezifische URL-Vorschau, die währungsabhängige Produktpreis-Anzeige und die Anzeigen zum Abschneiden nach Pixelbreite.
Speichere das wiederverwendbare Liquid als Theme-Snippet und rendere es aus layout/theme.liquid, oder kopiere die separate statische HTML-Ausgabe zum Testen.

Datenschutz & Einschränkungen

Deine Shop- und Produktdaten bleiben vollständig in deinem Browser.

Häufige Fragen

Warum Titel in Pixelbreite statt nach Zeichenanzahl messen?

Google schneidet SERP-Titel nach der Pixelbreite des Containers (~600px) ab, nicht nach einer exakten Zeichenanzahl. Breite Zeichen ('W', 'M') brauchen mehr Platz als schmale ('i', 'l').

Wo füge ich das Liquid-Snippet ein?

Speichere es als Snippet, z. B. snippets/toea-meta-tags.liquid, und rendere dieses Snippet im <head> von layout/theme.liquid. Es liest zur Laufzeit Produkt-, Collection-, Page-, Shop- und Währungsobjekte, daher sind Vorschauwerte nicht hart codiert. Ersetze überlappende Theme-Metadaten, statt einen zweiten title- oder description-Tag hinzuzufügen.

Kann ich die statische HTML-Ausgabe in theme.liquid einfügen?

Verwende den statischen HTML-Bereich nur für Vorschauen oder einen kontrollierten Test. Er enthält die hier eingegebenen Werte; für ein Live-Theme nutze die wiederverwendbare Liquid-Ausgabe, damit jede Seite ihre eigenen Shopify-Daten bekommt.

Kostenloses Tool · läuft in deinem browser · kein Konto nötig