Open Graph Tag Generator
Generate Open Graph and Twitter card tags for a page.
What you provide
Must be absolute. 1200 × 630 is the size platforms expect.
How this calculation works
The generator assembles the Open Graph properties that platforms actually read, escapes the values so quotation marks and ampersands cannot break the markup, and adds the Twitter card tags alongside. Lengths are checked against where platforms typically truncate, and the tags most often left out get flagged rather than silently omitted. The result goes in the head of the page, where crawlers read it without executing any script.
What the results mean
- og:image
- The single biggest factor in whether a shared link gets attention. It must be an absolute URL, and 1200 by 630 pixels is the size that reliably renders as a large card.
- og:url
- The canonical address for the content. Setting it means shares of tracking-tagged URLs still consolidate on one page rather than fragmenting.
- twitter:card
- Chooses between a large image and a small thumbnail layout. Large image needs an image of adequate size or the platform quietly falls back.
Common problems and fixes
- The preview shows an old title or image
- Platforms cache what they fetched the first time, sometimes for a long while. Each has its own debugging tool that refetches a URL on demand, and using it is the only reliable way to update a card. Adding a query parameter to the shared link works too, though it fragments the share count.
- No image appears at all
- Check that the image URL is absolute rather than relative, since a relative path resolves against the wrong host when a platform fetches it. Then check the file size and dimensions, as very large files time out and small ones fall back to a thumbnail. Finally make sure the image is publicly reachable, because anything behind authentication or a hotlink block cannot be fetched.
Frequently asked questions
Do I need both Open Graph and Twitter tags?
A minimal set of both is worth having. Most platforms read Open Graph, including several that never used it originally, and Twitter falls back to Open Graph for anything it does not find in its own tags. Adding twitter:card is what lets you choose the layout, so it is the one Twitter-specific tag that earns its place.
What image size should I use?
1200 by 630 pixels, at a ratio close to 1.91 to 1. That renders correctly nearly everywhere. Keep important content away from the edges, since platforms crop differently, and keep the file comfortably under a megabyte so the fetch does not time out.
Do these tags affect search rankings?
No. They control how a link appears when shared on social platforms and messaging apps. The indirect benefit is real though: a link that presents well gets clicked and shared more, and the traffic and links that follow do matter.
Put this on your own site
Free to embed, no attribution required beyond the source link the frame carries itself. It runs entirely in your visitor's browser, sets no cookies and loads no third-party script.
<iframe src="https://runthetests.com/embed/open-graph-generator/" width="100%" height="560" style="border:1px solid #e5e5e5;border-radius:8px" title="Open Graph Tag Generator" loading="lazy"></iframe>
Preview it at https://runthetests.com/embed/open-graph-generator/. Embedded pages are marked noindex, so yours stays the canonical copy — not this one.