Téma

OG-képek blogbejegyzésekhez

A blogbejegyzésekhez tartozó OG-kép az a 1200×630 méretű közösségi előnézeti kép, amely akkor jelenik meg, amikor valaki megosztja a cikkét az X, LinkedIn, Facebook, Slack vagy WhatsApp platformokon. A FastOG ezt dinamikusan, igény szerint állítja elő a bejegyzés címéből, kivonatából és szerzőjéből – nincs szükség tervezésre, feltöltésre, előfizetésre, és a kezdéshez nem kell bejelentkezni.

Miért van szüksége minden blogbejegyzésnek saját OG-képre

A kártya nélkül, vagy elavult, általános képpel megosztott link beleolvad az összes többi bejegyzés közé. A tényleges címet és tiszta elrendezést tartalmazó, bejegyzésenkénti kártya több megosztást és több kattintást eredményez. Az egyes bejegyzésekhez kézzel generált kép költsége az oka annak, hogy a legtöbb blog egyetlen alapértelmezett képre szorítkozik – pontosan ezt a problémát szünteti meg a FastOG.

Hogyan készítsünk dinamikus OG-képet egy blogbejegyzéshez

A URL-t az oldal megjelenítésekor írja alá a template=blog, a bejegyzés címével, egy részlettel és a szerzővel. A közösségi oldalak keresőrobotja lekéri, a FastOG egyszer rendereli le a PNG-t, a Cloudflare pedig gyorsítótárba helyezi, így minden későbbi megosztás azonnali és ingyenes.

tsx

// Next.js App Router — app/blog/[slug]/page.tsx
export async function generateMetadata({ params }) {
    const post = await getPost(params.slug);
    return {
        title: post.title,
        openGraph: {
            images: [generateOgImageUrl({
                template: "blog",
                title: post.title,
                subtitle: post.excerpt,
                author: post.author.name,
            })],
        },
    };
}

Használja a template=blog-t egy dedikált blogkártyához szerzővel és címsorral, vagy a default-at egy letisztultabb, csak címet tartalmazó elrendezéshez. Minden sablon 1200×630-as méretben renderel.

Melyik sablon illik a blogjához

Ha a blogja…	Használja ezt a sablont	Előny
Szerzőt és kivonatot jelenít meg	`blog`	szerzői sor is tartozik hozzá
Többnyire címből és szlogenből áll	`default`	minimalista, márkára fókuszáló
Fotót vagy borítóképet használ	`editorial` / `image-right`	fotóközpontú elrendezés
Bejelentéseket / termékbejegyzéseket tesz közzé	`launch`	verzió- és domainmezők

GYIK

Mennyibe kerül a FastOG blogbejegyzésekhez?

Egy renderelés egyedi képenként; az azonos URL-ek a peremhálózaton (edge cache) örökre gyorsítótárba kerülnek, és nem számítanak bele a havi kvótába.

Újra kell generálnom a képet, ha szerkesztek egy bejegyzést?

Csak akkor, ha a cím, a kivonat vagy a szerző változik — az URL a tartalomtól függ, így a tartalomváltozás új URL-t és új renderelést eredményez. A változatlan URL gyorsítótárban marad, és nem számít bele a kvótába.

Használhatom a FastOG-t a meglévő blogkeretrendszeremmel?

Igen. Beépülő aláírók (signer) érhetők el a Next.js, React, SvelteKit, Vue/Nuxt, Astro, Express, Vanilla Node.js, JavaScript, PHP/Laravel, Python és Ruby/Rails rendszerekhez. Lásd az SDK oldalt.

Próbáld ki ingyen – regisztráció nélkül

Tekintsd meg és teszteld a dinamikus OG képeket másodpercek alatt.

Nyisd meg az ingyenes OG kép tesztelőt