Open Graph Image

Render one per post your users publish, from your CMS or publish webhook, with the title, author, date and the site's logo.

Image, 1200 × 630, 1 credit

Output

Open Graph Image, rendered by oJo with its first sample

Variables

  • post.author.avatarUrltext
    data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 64 64%22%3E%3Crect width=%2264%22 height=%2264%22 fill=%22%23ede9fe%22/%3E%3Ccircle cx=%2232%22 cy=%2225%22 r=%2211%22 fill=%22%237c3aed%22/%3E%3Cpath d=%22M12 58c2-12 10-18 20-18s18 6 20 18z%22 fill=%22%237c3aed%22/%3E%3C/svg%3E
  • post.author.nametext
    Priya Natarajan
  • post.publishedAttext
    2026-10-14
  • post.readingMinutesnumber
    6
  • post.titletext
    Shipping our first public API
  • site.colortext
    #7c3aed
  • site.hosttext
    notes.lumen.example
  • site.logoUrltext
    data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 44 44%22%3E%3Crect width=%2244%22 height=%2244%22 rx=%229%22 fill=%22%237c3aed%22/%3E%3Ccircle cx=%2222%22 cy=%2222%22 r=%228%22 fill=%22%23fff%22/%3E%3C/svg%3E
  • site.nametext
    Lumen Notes

Send any of these in modify. Anything you leave out prints the sample value, and the response lists it in warnings.

Render it

Save the template to your account first. Saving gives you its ID.

curl --request POST \
  --url https://api.ojo.so/v1/image/template \
  --header 'Authorization: Bearer <your API key>' \
  --header 'Content-Type: application/json' \
  --data '{
  "templateId": "<YOUR_TEMPLATE_ID>",
  "modify": {
    "site": {
      "name": "Lumen Notes",
      "host": "notes.lumen.example",
      "color": "#7c3aed"
    },
    "post": {
      "title": "Shipping our first public API"
    }
  },
  "viewportWidth": 1200,
  "viewportHeight": 630
}'

What's included

Related templates

All templates
Open Graph Image for Blog Posts - oJo