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.

How to use it

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.

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—this generator’s combo output should be checked against each platform you care about.

Common mistakes

Relative image URLs break previews off-site. Blocking OG image paths with hotlink protection breaks cards. Duplicate conflicting og: tags from plugins create unpredictable winners. Reusing site-wide defaults makes every page look identical in shares. Forgetting to update OG when the hero or price changes misleads users and hurts trust.

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