How to Use Open Graph Tag Generator: Complete Guide (2026)

What is Open Graph Tag Generator?

An Open Graph tag generator builds the meta tags social apps read when someone shares your URL. ToolsMinify's free generator turns a title, description, URL, image, type, site name, and locale into copy-ready og:* HTML - plus optional Twitter Card tags - with a live social preview. Paste the markup into your page head so Facebook, LinkedIn, Slack, Discord, and iMessage show the card you intended instead of a guessed thumbnail.

Generate Open Graph and Twitter Card meta tags from a title, description, URL, and image. Free OG tag generator with live HTML and a social preview.

Why use Open Graph Tag Generator?

• Generate og:title, og:description, og:url, og:type, og:image, og:site_name, and og:locale as you type
• Optional Twitter Card tags (summary or summary_large_image) in the same snippet
• Live HTML output with attribute escaping for quotes and ampersands
• Social preview so you can spot a weak title or missing image before you publish
• Runs entirely in your browser - drafts never leave the device

How to use Open Graph Tag Generator - step by step

1. Step 1: Enter the page title, description, canonical URL, and image URL.
2. Step 2: Choose an og:type (website, article, product, or profile).
3. Step 3: Add an optional site name and locale (for example en_US).
4. Step 4: Leave Twitter Card tags on unless you only want Open Graph markup.
5. Step 5: Copy the HTML and paste it inside the head of your page.

The Open Graph Tag Generator lives under SEO Tools. Open the tool page, enter your input in the main field, and results update instantly. Use the copy button to paste output into documents, code editors, or spreadsheets.

Common use cases

Blog posts and articles

Set og:type to article, add a 1200 x 630 cover image, and copy the tags into your post template so shares show the headline you wrote.

Product and landing pages

Use type product or website with a hero image and benefit-led description so ads and chat previews match the page.

Homepage and brand shares

Add og:site_name and a locale like en_US so LinkedIn and Slack display your brand under the title.

CMS and framework metadata

Generate the HTML once, then map each property into Next.js, WordPress, or a head snippet when editors paste titles and image URLs.

Examples

• Blog article share card: Title "Open Graph tags for a blog post", type article, a 1200 x 630 image, and the post URL produce og:title, og:type, og:image, and og:url ready to paste into the article template.
• Homepage with site name: Use type website, your brand as og:site_name, and the homepage URL so Slack and LinkedIn show the brand name under the title.
• Product listing: Type product plus a title, price-led description, product URL, and hero image gives a shoppable-looking card on Facebook and iMessage.
• Quotes and ampersands: A title like Shop "A & B" is escaped to Shop "A & B" so the HTML stays valid when you paste it.

Pro tips

• Use an absolute https image URL. Relative paths often fail in Facebook and Slack crawlers.
• 1200 x 630 px is the usual landscape size. Square images get cropped on most networks.
• Keep titles short (about 60 characters) and descriptions under ~200 characters so cards do not truncate mid-word.
• After you deploy, scrape the live URL in Facebook Sharing Debugger and LinkedIn Post Inspector to refresh the cache.
• Pair with Meta Description Checker for the Google snippet - Open Graph owns social cards, not the SERP description.

Frequently asked questions

What are Open Graph tags?

Open Graph tags are meta elements (og:title, og:description, og:image, og:url, og:type) that tell social apps how to render a link preview. Without them, Facebook, LinkedIn, and Slack often guess a weak title or the wrong image.

Which Open Graph tags do I need?

Start with og:title, og:type, og:image, and og:url. Add og:description, og:site_name, and og:locale when you have them. This generator emits only the fields you fill in, plus og:type (default website).

What size should the og:image be?

Use an absolute https URL. 1200 x 630 pixels is the usual landscape size for Facebook and LinkedIn. Smaller images may crop or fall back to a tiny thumbnail.

Do I also need Twitter Card tags?

X (Twitter) can read Open Graph tags, but twitter:card, twitter:title, twitter:description, and twitter:image give you explicit control. Turn the option on to include them. An image uses summary_large_image; no image uses summary.

Where do I paste the HTML?

Paste the tags inside the head of the HTML document (or your framework's metadata API). They must be on the public URL you set as og:url so crawlers can see them.

Does my copy leave the device?

No. The Open Graph Tag Generator runs entirely in your browser. Titles, URLs, and image links are not uploaded or stored on a server.

Related tools you might need

Explore other seo tools on ToolsMinify. Related utilities are linked on the Open Graph Tag Generator page to help you complete your workflow without leaving the site.