Open-Graph-Daten

Was ist Open Graph?

Open Graph ist ein 2010 von Facebook (Meta) entwickeltes Protokoll, mit dem Sie entscheiden können, wie Ihre Inhalte beim Teilen in sozialen Medien erscheinen. Ohne Open Graph-Tags wählen die Plattformen aus, welcher Titel, welche Beschreibung und welches Bild angezeigt wird - und das Ergebnis ist oft ungenau oder unattraktiv.

Mit den richtigen OG-Tags haben Sie die Kontrolle über den Titel, die Beschreibung und das Bild, die in der Vorschaukarte angezeigt werden, wenn jemand einen Link zu Ihrem Online-Shop teilt.

Die wichtigsten OG-Tags

Hier sind die Tags, die für Ihren Online-Shop am wichtigsten sind:

• and:title - Der Titel, der bei der Freigabe angezeigt wird. Er sollte kurz, präzise und einprägsam sein (normalerweise 40-60 Zeichen).
• and:description - Die Beschreibung unterhalb des Titels. Sie sollte den Inhalt überzeugend zusammenfassen (typischerweise 100-160 Zeichen).
• and:image - Das Bild, das in der Vorschaukarte angezeigt wird. Der wichtigste Tag, da Bilder das erste sind, was dem Auge ins Auge fällt.
• and:url - Die kanonische URL für die Seite. Stellt sicher, dass alle Freigaben auf die richtige Seite zeigen.
• and:type - Die Art des Inhalts. Für Produktseiten verwenden Sie "product", ansonsten "website".
• and:site_name - Der Name Ihres Webshops.
• and:locale - Die Sprache (z.B. "da_DK" für Dänisch).

Produktspezifische OG-Tags

Für Produktseiten können Sie zusätzliche Tags hinzufügen, die den sozialen Medien weitere Informationen liefern:

• product:price:amount - Produktpreis
• product:price:currency - Währung (z. B. "DKK")
• product:original_price - Ursprünglicher Preis (falls im Angebot)
• product:sale_price - Angebotspreis
• product:shipping_cost - Kosten für den Versand

Open Graph in Shoporama

Shoporama generiert automatisch Open Graph-Tags für alle Seiten:

• Produktseiten: and:title, and:description, and:image (primäres Produktbild in 1200×630px), and:type="product", Preis-, Angebots- und Versanddaten.
• Kategorien und Landing Pages: Titel, Beschreibung und eventuell Kategoriebild.
• Statische Seiten: Titel und Beschreibung aus den Metadaten der Seite.

Sie können die automatischen Werte außer Kraft setzen, indem Sie Meta-Titel und -Beschreibung individuell für Produkte, Kategorien und Seiten festlegen.

Bilder für OG-Tags

Das Bild ist das wichtigste Element eines Social Share. Hier sind die Richtlinien:

• Größe: Empfohlen 1200×630 Pixel (Verhältnis 1,91:1). Unter 600×315 wird ein kleines Thumbnail anstelle einer großen Karte angezeigt.
• Format: JPG oder PNG. Halten Sie die Dateigröße unter 8 MB.
• Inhalt: Verwenden Sie Produktbilder von guter Qualität. Vermeiden Sie zu viel Text im Bild - Facebook kann Freigaben mit zu viel Text ausblenden.

Testen Sie Ihre OG-Tags

Verwenden Sie diese Tools zum Testen und Debuggen Ihrer Open Graph-Tags:

• Facebook Sharing Debugger: Zeigt genau an, wie Ihr Link auf Facebook aussieht und hilft, den Cache bei Aktualisierungen zu löschen.
• LinkedIn Post Inspector: Ähnlich für LinkedIn-Shares.
• Twitter Card Validator: Für Twitter/X-Vorschau.

Es ist wichtig, auf Änderungen zu testen, da soziale Medien Daten zwischenspeichern UND Daten. Verwenden Sie die Debugger-Tools, um eine Aktualisierung zu erzwingen.