Dynamiska OG-bilder för SaaS
Dynamiska OG-bilder för SaaS är sociala förhandsvisningar per sida som genereras automatiskt när din dashboard, dokumentation, changelog eller användarvända rutter delas. FastOG renderar varje bild på begäran och cachar den, så att en SaaS kan ge varje sida ett unikt varumärkesanpassat kort utan manuellt designarbete.
Varför SaaS behöver dynamiska OG-bilder
SaaS-produkter har många delbara ytor – produktsidor, dokumentsidor, changelog-poster, offentliga användarprofiler och prestationskort. Varje sådan yta som delas på X eller LinkedIn tjänar på att ha sitt eget kort istället för en enda logotyp som fallback. Att generera dessa för hand skalar inte; att generera dem vid renderingstillfället gör det.
Grundmönstret
För varje sida du vill ha ett kort för, signera en URL med sidans titel (och eventuella sidspecifika fält) vid renderingstillfället. FastOG renderar PNG:n vid första hämtningen och Cloudflare cachar den.
// 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",
})],
},
};
}
Bra SaaS-användningsfall
| Yta | Mallidéer |
|---|---|
| Produkt-/marknadssidor | company, hero, product |
| Dokumentsidor | default, devtool |
| Ändringsloggposter | changelog, launch |
| Offentliga användar-/avatar-kort | testimonial, stats, image-right |
| Prissidor | pricing, stats |
FAQ
Behöver jag en mall per användningsområde?
Nej. En mall plus de URL-fält du skickar räcker oftast; ett par mallar täcker resten. Alla renderas i 1200×630.
Hur hanterar jag många sidor utan att förbruka kvoten?
Identiska URL:er cachas på kanten (edge-cached) för alltid efter första renderingen, så samma sida som delas 1 000 gånger räknas som 1 rendering. Ändrat innehåll ger bara en ny URL.
Kan jag märka korten med min SaaS-identitet?
Ja — ställ in brand_name, brand_logo, bg_color, typsnitt och mönster per URL. Se lekplatsen för att förhandsgranska mallar live.
Relaterat
Prova gratis – ingen registrering krävs
Förhandsgranska och testa dynamiska OG-bilder på några sekunder.
Öppna gratis OG-bildtestaren