Open Graph Tag Generator

Generate the meta tag block that controls how your link previews on Facebook, LinkedIn, Slack, and iMessage.

Around 60 characters for best display.

Around 155 characters.

1200x630 pixels recommended.

e.g. en_US

@ will be added automatically if missing.

What are Open Graph meta tags?

Open Graph meta tags are snippets of HTML in a page head that control how the link previews when shared on Facebook, LinkedIn, Slack, iMessage, and most other platforms. Tags like og:title, og:description, and og:image tell the platform exactly which headline, summary, and image to render in the card. Without them, platforms guess — often picking the wrong image or a truncated string of body text.

This Open Graph tag generator builds the complete meta tag block from a simple form. Enter the canonical URL, a title (around 60 characters displays best), a description (around 155 characters), and an image URL — 1200x630 pixels is the recommended size for large previews. You can also set the og:type (website, article, profile, and more), site name, and locale, and optionally include Twitter/X card tags in the same block so one copy-paste covers both ecosystems.

The output is properly HTML-escaped and generated entirely in your browser; nothing you type is uploaded anywhere. Paste the block into the head element of your page, then re-share the link or use each platform's debugger to refresh its cached preview.

How to generate Open Graph tags

  1. Enter the canonical URL

    Paste the full page URL including https:// into the Canonical URL field. This becomes the og:url tag.

  2. Write the title and description

    Aim for around 60 characters for the title and around 155 for the description so neither gets truncated in previews.

  3. Add an image and page details

    Paste an image URL (1200x630 pixels recommended), pick the og:type, and optionally fill in site name and locale such as en_US.

  4. Include Twitter/X tags if you want them

    Leave the Include Twitter/X card tags checkbox on to add twitter:card and twitter:site to the same block; the @ is added to your handle automatically.

  5. Copy the tags into your page head

    Click Copy tags and paste the block inside the head element of your HTML.

Frequently asked questions

Where do Open Graph tags go?

Inside the head element of your HTML page, alongside the title and other meta tags. Each tag is a meta element with a property attribute like og:title and a content attribute holding the value.

What size should an og:image be?

Use 1200x630 pixels for the standard large preview, which gives a 1.91:1 aspect ratio. Facebook requires at least 200x200, but small images get rendered as a tiny thumbnail or skipped entirely.

Why is my link preview not updating after I changed the tags?

Platforms cache previews aggressively. Use the Facebook Sharing Debugger, LinkedIn Post Inspector, or the equivalent tool for each platform to force a re-scrape of the URL after you update the tags.

What is the difference between og:type website and article?

Use website for home pages and general pages, and article for blog posts and news stories. The article type allows extra metadata like author and publish time, and some platforms display these types slightly differently.

Do Open Graph tags affect SEO rankings?

They are not a direct ranking factor, but better-looking link previews earn more clicks and shares, which drives traffic. Search engines may also use OG data as a fallback when other metadata is missing.

Want per-link Open Graph tags without touching code?

ReSlug lets you override OG title, description, and image on every short link, so every share looks intentional.

Create a free account