Open Graph Tag Generator

Create optimized Open Graph tags for better social media sharing

Basic Meta Tags
Recommended length: 60-90 characters
Recommended length: 200-250 characters
The canonical URL of your page
Recommended size: 1200x630 pixels (minimum 600x315)
Advanced Options

Generated Open Graph Tags

Preview
HTML Code

                    

What are Open Graph Tags?

Open Graph meta tags are snippets of code that control how URLs are displayed when shared on social media. They help you optimize your content for social media platforms like Facebook, Twitter, LinkedIn, and more.

Practical guide: Open Graph that survives real shares

What this is

Open Graph is Facebook’s vocabulary for link previews; many networks reuse it as a baseline. og:title, og:description, og:image, and og:url are the core quartet that controls the card users see when your URL is pasted into messengers, social feeds, and some email clients. OG does not replace HTML title tags for search—it controls the share surface.

When to prioritize Open Graph

  • Content designed for viral or community sharing (guides, tools, launches, events).
  • Product or pricing pages where the share image must show the SKU, not a generic brand banner.
  • After CMS rebuilds that strip or duplicate meta plugins.
  • When Slack/LinkedIn cards show the wrong title pulled from a stale cache or bare URL.
  • In tandem with SERP copy work—titles and descriptions still matter in Google (title tags, meta descriptions).

When OG is not enough

  • Do not expect OG alone to rank pages; it is not a ranking factor substitute for content quality.
  • Avoid site-wide identical OG packs that make every share look the same.
  • Skip relying on OG images hosted behind auth, VPN-only CDNs, or aggressive hotlink blocks.
  • Do not put critical legal disclaimers only in og:description—users who land on-page may never see the card again.
  • If you need Twitter-specific card types plus OG, prefer the combined social meta generator.

How to use this generator

Complete the fields for the exact page URL, then paste the generated tags once in <head>. Prefer a single strong landscape image near 1.91:1 when possible, hosted on your domain with caching headers that allow fetchers. Align og:url with your canonical. After publishing, use official sharing debug tools to scrape fresh metadata—stale cache is the #1 “it still looks wrong” cause.

Worked example

You publish a free checklist PDF landing page. og:title: “Technical SEO Hygiene Checklist (Free PDF).” og:description: “A printable pass for small business sites—crawl, index, and snippet checks in one hour.” og:image: 1200×630 branded cover of the checklist (text large enough to read in a feed thumbnail). og:url and canonical both use https://www.example.com/checklist/technical-seo-hygiene. First share still shows an old blog hero because Facebook cached a previous scrape of a soft-launched URL. Fix: open the sharing debugger, scrape again, confirm the new image, then reshare. Internally, the CMS SEO plugin had also injected a second og:title; removing the duplicate stops unpredictable winners. Tie the page into your hygiene checklist content so the card promise matches the download.

How to read the results

Validators show missing required properties and image fetch errors literally—follow the line numbers. If title/description truncate, adjust length and front-load meaning; pixels vary by client. When Twitter-specific tags exist alongside OG, Twitter usually prefers its own names—check each platform you care about after deploy.

Common mistakes

  • Relative image URLs that break previews off-site.
  • Blocking OG image paths with hotlink protection so fetchers get 403.
  • Duplicate conflicting og: tags from theme + plugin.
  • Reusing site-wide defaults so every page looks identical in shares.
  • Forgetting to update OG when the hero, price, or date changes.
  • Mismatching og:url and canonical so platforms cache the wrong variant.

QA checklist for a share-ready page

  1. Absolute HTTPS og:image; file under a few MB; sensible dimensions.
  2. Single set of core OG tags in rendered HTML (no duplicates).
  3. og:url equals the preferred canonical URL.
  4. Debugger scrape succeeds on Facebook and LinkedIn; card matches intent.
  5. Mobile share sheet crops acceptably—important text not at the edges.
  6. Owner assigned to re-scrape after creative or offer changes.

Related reading

SEO guide · Meta descriptions that match · Title tags that earn clicks · Technical hygiene. Related tools: social meta, meta tags, canonical URL.

Before / after: plugin duplicate tags

Before: Theme defaults plus an SEO plugin both printed og:title and og:image. Slack sometimes showed the brand homepage card on article shares because a relative image path resolved incorrectly in one of the sets.

After: The team disabled theme OG output, kept a single plugin (or manual tags from this generator), switched images to absolute HTTPS CDN URLs, and verified with debuggers. Share previews stabilized across Facebook, LinkedIn, and Slack.

Image specs that usually work

Aim near 1200×630 for landscape link cards, keep file weight moderate, and avoid critical text at the extreme edges where mobile crops. Prefer PNG/JPEG on your domain. If a platform still fails to fetch, check robots rules, hotlink protection, and whether the image URL redirects through a tracker—fetchers are pickier than browsers.

Why Open Graph Tags Matter

Required Open Graph Tags

Tag Description Example
og:title The title of your page <meta property="og:title" content="Your Title Here">
og:description A brief description <meta property="og:description" content="Your description here">
og:image The URL of your featured image <meta property="og:image" content="https://example.com/image.jpg">
og:url The canonical URL <meta property="og:url" content="https://example.com/page">

Image Size Guidelines

Best Practices

Frequently Asked Questions

While Twitter can read Open Graph tags, using specific Twitter Card tags gives you:
  • Better control over Twitter appearances
  • Access to Twitter-specific features
  • More consistent display on Twitter
  • Better analytics in Twitter's dashboard