← buildlog og

Dynamic OG images for Ghost

Ghost themes are Handlebars; add the tag in default.hbs and URL-encode with the encode helper. The API returns a 1200×630 PNG, cached at the edge.

{{!-- default.hbs, inside <head> after {{ghost_head}} --}}
{{#is "post, page"}}
<meta property="og:image" content="https://og.sadana.app/api/og?title={{encode title}}&subtitle={{encode excerpt}}&site={{encode @site.url}}">
{{/is}}

Ghost already outputs og:image from the feature image; only add this for posts without one, or remove the feature image to avoid duplicates.

Preview

Example OG image for Ghost

Parameters

title     required, up to 200 chars
subtitle  optional
site      optional footer text
theme     light | dark (Pro)
key       Pro license key (removes watermark)

Check it

After deploying, paste a URL into a card validator (e.g. opengraph.xyz) or share it in a private Slack/Discord channel. Social crawlers cache images, so change the URL (e.g. add &v=2) to force a refresh.

Try the generator

Other frameworks

Next.js · Astro · Hugo · WordPress · Ghost · SvelteKit · Nuxt · Eleventy (11ty) · Jekyll · Docusaurus · plain HTML