Generate an OG image for every blog post
How do I generate OG images automatically for every blog post?
Put a signed Platemark URL in each page's og:image tag. The URL carries the post title, and the first time a crawler loads it Platemark renders a 1200x630 PNG with the title set large. After that it's served from cache, so it costs one credit per post, not per share.
This works with any site generator, Next.js, Astro, Hugo, WordPress or Ghost, because it's only a URL. There's no build step and nothing to host.
import crypto from "crypto";
const params = new URLSearchParams({ a: ACCOUNT_ID, title: post.title });
params.sort();
const s = crypto.createHmac("sha256", SIGNING_SECRET).update(`og-image?${params}`).digest("hex").slice(0, 32);
const ogImage = `https://platemark.rowhousesoftware.com/v1/images/og-image.png?${params}&s=${s}`;Questions
Do I need a server?
Only to sign the URL, which any build script can do. The image itself is served by Platemark.
Can it include a photo?
Use the og-image-photo template and add a photo parameter.