🔗 Open Graph Preview
Preview how your web page looks when shared on Facebook, Twitter, LinkedIn, and WhatsApp. Check Open Graph and Twitter Card tags. Free online OG preview tool.
27/95
57/200
Facebook / Open Graph
No image
ONHTML.COM
My Awesome Page — onHTML.com
Free online tools for developers: HTML, CSS, JSON and more.
Twitter / X Card
No image
My Awesome Page — onHTML.com
Free online tools for developers: HTML, CSS, JSON and more.
onhtml.com
How to Use
1
Enter your metadata
Fill in the title, description, image URL, and site name. These map to og:title, og:description, og:image, and og:site_name.
2
See the live preview
Watch the Facebook and Twitter card previews update in real time as you type.
3
Copy the meta tags
Click Copy Meta Tags to get the full Open Graph <meta> block ready to paste in your <head>.
Frequently Asked Questions
What are Open Graph meta tags?
Open Graph (OG) meta tags control how your page appears when shared on social media. They define the title, description, image, and URL that Facebook, LinkedIn, Twitter, and other platforms display in link previews.
Why does my Facebook preview look wrong?
Facebook caches OG data. After adding or updating OG tags, use the Facebook Sharing Debugger to clear the cache and re-scrape your URL. It may take a few minutes to update.
What is the ideal OG image size?
The recommended OG image size is 1200×630 pixels (1.91:1 ratio). Minimum is 600×315px. Twitter large card uses 1200×628px. PNG or JPG format, under 8MB.
What is the difference between og:title and the page title tag?
og:title is specifically for social media sharing and can differ from the HTML <title> tag. You might use a shorter, more engaging title for social sharing while keeping a keyword-optimized title for SEO.
Do all social platforms support Open Graph?
Facebook, LinkedIn, Pinterest, and most messaging apps use the Open Graph protocol. Twitter has its own Twitter Card system (twitter:card tags) but also falls back to OG tags if Twitter Cards are not defined.
完整指南：Open Graph预览工具
什么是Open Graph？
Open Graph协议控制URL在社交媒体分享时的显示效果：标题、描述和图片。OG图片配置错误会导致分享效果差、点击率低。
如何使用
- 输入URL或直接粘贴meta标签。
- 查看在Facebook、LinkedIn和Twitter上的预览效果。
- 修复缺失图片、截断文本或错误URL。
专业技巧
- OG图片理想尺寸：Facebook/LinkedIn为1200×630px。
og:image使用绝对URL，不要用相对路径。- 更新meta标签后用Facebook调试器和LinkedIn Post Inspector清除缓存。