Dynaamiset OG-kuvat SaaS-palveluille

Dynaamiset OG-kuvat SaaS-palveluille ovat sivukohtaisia sosiaalisen median esikatseluita (social previews), jotka luodaan automaattisesti, kun kojelautaasi (dashboard), dokumentaatiosi, muutosloki tai käyttäjille suunnatut reitit jaetaan. FastOG renderöi jokaisen kuvan pyynnöstä ja tallentaa sen välimuistiin, joten SaaS-palvelu voi antaa jokaiselle sivulle ainutlaatuisen brändätyn kortin ilman manuaalista suunnittelutyötä.

Miksi SaaS-tuotteet tarvitsevat dynaamisia OG-kuvia

SaaS-tuotteissa on monia jaettavia pintoja — tuotesivuja, dokumentaatiosivuja, muutoslokeja, julkisia käyttäjäprofiileja ja saavutuskortteja. Jokainen X:ssä tai LinkedInissä jaettu sivu hyötyy omasta kortistaan yksittäisen logovarasijaisen sijaan. Näiden luominen käsin ei skaalaudu; niiden luominen renderöinnin yhteydessä skaalautuu.

Ydinmalli

Jokaiselle sivulle, jolle haluat kortin, allekirjoita URL-sivun otsikolla (ja mahdollisilla sivukohtaisilla kentillä) renderöinnin yhteydessä. FastOG renderöi PNG-kuvan ensimmäisellä haulla, ja Cloudflare tallentaa sen välimuistiin.

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",
            })],
        },
    };
}

Hyvät SaaS-käyttötapaukset

Pinta	Malli-ideoita
Tuote-/markkinointisivut	`company`, `hero`, `product`
Dokumentaatiosivut	`default`, `devtool`
Muutoslokin merkinnät	`changelog`, `launch`
Julkiset käyttäjä-/profiilikortit	`testimonial`, `stats`, `image-right`
Hinnoittelusivut	`pricing`, `stats`

UKK

Tarvitsenko mallipohjan jokaista käyttötapausta varten?

Ei. Yksi mallipohja sekä välittämäsi URL-kentät riittävät yleensä; pari mallipohjaa kattaa loput. Kaikki renderöityvät koossa 1200×630.

Miten käsittelen monia sivuja polttamatta kiintiötä?

Identtiset URL-osoitteet välimuistitetaan reunalla pysyvästi ensimmäisen renderöinnin jälkeen, joten sama sivu jaettuna 1 000 kertaa kuluttaa yhden renderöinnin. Sisällön muutokset tuottavat vain uuden URL-osoitteen.

Voinko brändätä kortit SaaS-identiteetilläni?

Kyllä — aseta brand_name, brand_logo, bg_color, fontit ja kuviot URL-kohtaisesti. Katso leikkikenttää esikatsellaksesi mallipohjia livenä.

Kokeile ilmaiseksi — ei vaadi rekisteröitymistä

Esikatsele ja testaa dynaamisia OG-kuvia sekunneissa.

Avaa ilmainen OG-kuvien testaaja

Aihe