💡 Open Graph Preview
Generate Open Graph meta tags and preview how your content appears when shared on Facebook, Twitter, LinkedIn, and other social platforms.
📝 Content Information
0/60 characters (recommended)
0/160 characters (recommended)
Recommended: 1200x630px (1.91:1 ratio)
👁️ Live Preview
Facebook
Twitter
LinkedIn
🖼️
EXAMPLE.COM
Your Page Title
Your description will appear here when shared on social media.
💻 Generated Meta Tags
# Click "Generate Meta Tags" to create your code
💡 Best Practices
- Title: Keep under 60 characters for best display across platforms
- Description: 50-160 characters works best for social previews
- Image: Use 1200x630px (1.91:1 ratio) for perfect display
- Testing: Use Facebook Debugger and Twitter Card Validator to test
- Updates: Clear cache using debugging tools when updating tags
📋 How to Use the Open Graph Preview Tool
- Enter the page title, description, image URL and page URL. Add a site name and Twitter handle if you have them.
- Select Generate Meta Tags to see the preview and the code.
- Copy the tags into the head section of your page.
🎯 When to Use It
- Checking how a link will look before you share it on Facebook, LinkedIn or X.
- Writing the social tags for a new page or blog post.
- Fixing a link that shows the wrong image or title when shared.
💡 Tips & Common Pitfalls
- A 1200×630 pixel image works well across most platforms.
- The image URL must be absolute and publicly reachable, or no preview image will be shown.
- Social platforms cache previews. After changing tags, use each platform's debugger to refresh them.
- Keep the title short and the description under about 150 characters so they are not cut off.
❓ Frequently Asked Questions
What are Open Graph tags?
Open Graph tags are meta tags that control how your content appears when shared on social media platforms like Facebook, LinkedIn, and others.
Where do I place these tags?
Place Open Graph tags in the <head> section of your HTML, preferably near the top. They should be on every page you want to share.
What's the difference between OG and Twitter tags?
Open Graph (og:) tags are used by Facebook and LinkedIn. Twitter uses its own twitter: tags but falls back to OG tags if Twitter tags aren't present.
How do I test my tags?
Use Facebook Sharing Debugger, Twitter Card Validator, and LinkedIn Post Inspector to test how your content appears on each platform.