Skip to content
Zoyku

Open-Graph-Generator

Den vollständigen Satz og:- und twitter:-Meta-Tags bauen und die Teaser-Kartenvorschau live aktualisieren sehen, bevor Sie irgendetwas einfügen.

HTML snippet

Share card preview

image URL (1200 × 630)

example.com

Page title

Dieses Tool läuft vollständig in Ihrem Browser. Ihre Daten verlassen Ihr Gerät nie — sie werden auf keinen Server hochgeladen.

So verwenden Sie es

  1. 1Geben Sie Seitentitel, Beschreibung und Canonical-URL ein.
  2. 2Fügen Sie die Teaser-Bild-URL hinzu (1200 × 630 px funktionieren überall) und stellen Sie den Kartentyp ein.
  3. 3Kopieren Sie die Tags in Ihren <head> und prüfen Sie die Vorschaukarte.

Open-Graph-Generator

Wenn Ihr Link auf X, Facebook, LinkedIn, Slack oder iMessage geteilt wird, entsteht die Vorschaukarte fast vollständig aus Open-Graph-Tags, mit Twitter-Card-Tags für die Lücken. Dieser Generator gibt beide Namensräume aus: og:title, og:type, og:url, og:image, og:image:alt, og:site_name, og:description und og:locale, dazu twitter:card, twitter:site und twitter:creator.

Die meisten Plattformen greifen auf die og:-Tags zurück, wenn ein twitter:-Tag fehlt — die Extras braucht es also nur, wo sie abweichen. Die Live-Vorschau nähert an, wie eine Großbild- oder Summary-Karte rendert.

Häufige Fragen

Welche Bildgröße sollte ich für og:image nutzen?

1200 × 630 Pixel (1.91:1) ist der sichere Standard über Facebook, X und LinkedIn hinweg. Halten Sie die Datei unter 8 MB, nutzen Sie eine absolute URL und fügen Sie immer og:image:alt für Barrierefreiheit hinzu.

Brauche ich sowohl og:- als auch twitter:-Tags?

twitter:title, twitter:description und twitter:image greifen auf ihre og:-Entsprechungen zurück. Über dem og:-Satz hinaus brauchen Sie nur twitter:card (summary oder summary_large_image), twitter:site und optional twitter:creator.

Welches og:type soll ich wählen?

website für Startseiten und generische Seiten, article für Nachrichten und Blogposts (mit article:published_time, wenn möglich), und product für Detailseiten im E-Commerce. Der Typ beeinflusst, wie manche Plattformen den Link einordnen.

Verwandte Tools

Alle SEO-Tools →

Meta-Tag-Generator

Titel-, Beschreibungs-, Keywords-, Robots- und Viewport-Meta-Tags erzeugen, mit Live-HTML-Ausgabe zum direkten Einfügen in Ihren <head>.

Alle Tools →

SERP-Vorschau

Ihren Google-Snippet auf Desktop und Mobilgerät vorschauen, mit Pixel-Level-Abschneidung und Längenmessern für Titel und Beschreibung.

Alle Tools →

Schema-Markup-Generator

Gültige JSON-LD-strukturierte Daten für Organization, LocalBusiness, Product, Article, FAQPage und HowTo erzeugen — escaped und einfügebereit.

Alle Tools →

UTM-Link-Builder

utm_source, medium, campaign, term und content an beliebige URLs anhängen und einen korrekt kodierten Tracking-Link erhalten, den Sie kopieren oder teilen.

Alle Tools →

Dieses Tool einbetten

Binden Sie dieses Tool mit einer Zeile in Ihre Website ein — es läuft im Browser des Besuchers.

<iframe src="https://zoyku.com/de/tools/open-graph-generator?embed=1" width="100%" height="640" style="border:0;border-radius:16px" title="Zoyku — open-graph-generator" loading="lazy"></iframe>
100% local processing