Getting started

Quickstart

Three steps to a live, dynamic Open Graph image.

1. Create a template and bind your domain

In the dashboard, start from a preset or a blank canvas, design your image, and save. Add one of your page URLs (or import your sitemap) so the template binds to your site's domain — that's what OGKit is allowed to read on a live request. Each saved template gets a unique API key; copy it from the editor's API panel or the API keys page.

2. Add one meta tag

Drop this into every page's <head>, replacing YOUR_KEY with your template key and {{canonical_url}}with the page's own absolute URL. OGKit reads that page for its real title and description — so this single tag covers every page:

HTML — <head>

<meta property="og:image"
  content="https://ogkit.org/api/og?key=YOUR_KEY&url={{canonical_url}}" />
<meta name="twitter:card" content="summary_large_image" />

Prefer to supply the text yourself (e.g. for a page you can't crawl)? Add &title=, &subtitle=, or &site= and they override the pulled content. See the API reference.

3. Verify

Paste your page URL into a social debugger (X Card Validator, LinkedIn Post Inspector, or opengraph.xyz) and confirm the image renders. Crawlers cache aggressively — use the debugger to force a re-fetch after changes.

Want to see it with your own key and text first? Open the Playground — signed-in, it fills in your real key and a copy-paste snippet.