Dynamische OG-Bilder für SaaS

Dynamische OG-Bilder für SaaS sind pro Seite erzeugte Social-Previews, die automatisch generiert werden, wenn Ihr Dashboard, Ihre Dokumentation, Ihr Changelog oder benutzerorientierte Routen geteilt werden. FastOG rendert jedes einzelne bei Bedarf und speichert es zwischen, sodass ein SaaS jeder Seite eine einzigartige, markenbezogene Karte ohne manuelle Designarbeit geben kann.

Warum SaaS dynamische OG-Bilder benötigt

SaaS-Produkte bieten viele teilbare Oberflächen – Produktseiten, Dokumentationsseiten, Changelog-Einträge, öffentliche Benutzerprofile und Erfolgskarten. Jede dieser Seiten profitiert, wenn sie auf X oder LinkedIn geteilt wird, von einer eigenen Karte anstelle eines einzelnen Logo-Fallbacks. Diese manuell zu erstellen, skaliert nicht; sie zur Renderzeit zu generieren, schon.

Das Kernmuster

Für jede Seite, für die Sie eine Karte wünschen, signieren Sie eine URL mit dem Titel der Seite (und allen seitenbezogenen Feldern) zum Zeitpunkt des Renderns. FastOG rendert das PNG beim ersten Abruf und Cloudflare speichert es im Cache.

tsx

// Next.js — app/docs/[slug]/page.tsx
export function generateMetadata({ params }) {
    const doc = await getDoc(params.slug);
    return {
        openGraph: {
            images: [generateOgImageUrl({
                template: "default",     // or "devtool", "launch", "company"
                title: doc.title,
                subtitle: doc.excerpt,
                domain: "yoursaas.com",
            })],
        },
    };
}

Gute SaaS-Anwendungsfälle

Oberfläche	Vorlagenideen
Produkt-/Marketingseiten	`company`, `hero`, `product`
Dokumentationsseiten	`default`, `devtool`
Changelog-Einträge	`changelog`, `launch`
Öffentliche Benutzer-/Avatar-Karten	`testimonial`, `stats`, `image-right`
Preisseiten	`pricing`, `stats`

FAQ

Benötige ich eine Vorlage pro Anwendungsfall?

Nein. Eine Vorlage plus die URL-Felder, die Sie übergeben, reichen in der Regel aus; ein paar Vorlagen decken den Rest ab. Alle werden in 1200×630 gerendert.

Wie gehe ich mit vielen Seiten um, ohne mein Kontingent zu verbrauchen?

Identische URLs werden nach dem ersten Rendern dauerhaft im Edge-Cache gespeichert. Wenn dieselbe Seite also 1.000-mal geteilt wird, zählt das als ein Rendern. Inhaltsänderungen erzeugen lediglich eine neue URL.

Kann ich Karten mit meiner SaaS-Identität branden?

Ja – setzen Sie brand_name, brand_logo, bg_color, Schriftarten und Muster pro URL. Im Playground können Sie Vorlagen live in der Vorschau ansehen.

Kostenlos testen – keine Anmeldung erforderlich

Vorschau und Test dynamischer OG-Bilder in Sekunden.

Kostenlosen OG-Bild-Tester öffnen

Thema