OG Tag 预览 - Open Graph Meta 标签检查器
输入您的 Open Graph 和 Twitter 卡片值，以查看社交媒体的实时预览效果。立即生成可直接使用的 meta 标签代码。
什么是 Open Graph Meta 标签？
Open Graph (OG) meta 标签是 HTML meta 元素，用于控制您的网页在 Facebook、Twitter、LinkedIn 和 Discord 等社交媒体平台上分享时的显示方式。它们定义了在社交媒体预览卡片中显示的标题、描述、图像和 URL。正确配置的 OG 标签可以显著提高社交分享的点击率。
如何使用此 OG Tag 预览工具
- 输入 OG 值 — 填写 og:title、og:description、og:image URL、og:url、og:type 和 og:site_name
- 添加 Twitter 卡片标签 — （可选）覆盖 Twitter/X 卡片的标题、描述和图像
- 查看实时预览 — 准确查看您的页面在 Facebook、Twitter、LinkedIn 和 Discord 上的显示效果
- 复制生成的代码 — 单击“复制代码”以获取可直接粘贴到您的页面的 HTML meta 标签
为什么要使用此 OG Tag 预览器？
- 4 平台预览 — 同时查看 Facebook、Twitter/X、LinkedIn 和 Discord 预览
- 实时更新 — 预览会随着您的输入立即更新，无需重新加载页面
- 代码生成 — 自动生成格式正确的 meta 标签 HTML 代码
- Twitter 卡片支持 — 用于 Twitter 特定覆盖的单独字段（twitter:title、twitter:image 等）
- 无需服务器 — 一切都在您的浏览器中运行。没有数据发送到任何服务器
- 尺寸指南 — 内置最佳图像尺寸建议 (1200x630px)
FreeToolbox 与其他 OG 预览工具的比较
| 功能 | FreeToolbox | OpenGraph.xyz | MetaTags.io |
|---|---|---|---|
| 平台 | 4 (FB, TW, LI, DC) | 3 (FB, TW, LI) | 3 (Google, FB, TW) |
| 实时预览 | 是 | 是 | 是 |
| 代码生成 | 是 | 是 | 是 |
| Discord 预览 | 是 | 否 | 否 |
| 无需帐户 | 是 | 是 | 免费层级有限制 |
| 广告 | 极少 | 中等 | 重度 |
常见问题
推荐的 og:image 尺寸是多少？
推荐尺寸为 1200 x 630 像素（1.91:1 宽高比）。这在 Facebook、Twitter、LinkedIn 和 Discord 上效果良好。使用 PNG 或 JPG 格式，并将文件大小保持在 8MB 以下。
为什么此工具无法从 URL 获取 OG 标签？
浏览器安全（CORS 策略）阻止 JavaScript 从其他域获取内容。此工具使用手动输入，这实际上更适合在发布标签之前预览它们。
我是否需要 OG 和 Twitter 卡片标签？
如果缺少 Twitter 特定标签，Twitter/X 将回退到 OG 标签。但是，建议添加 twitter:card 以控制卡片类型。仅当您希望在 Twitter 上显示与在其他平台上显示不同的内容时，才使用 Twitter 特定标签。
我应该使用什么 og:type？
对于主页和常规页面，请使用“website”；对于博客文章和新闻，请使用“article”；对于产品页面，请使用“product”。默认的“website”适用于大多数情况。
如何测试我的实际在线 OG 标签？
将 meta 标签添加到您的页面后，请使用 Facebook 的 Sharing Debugger (developers.facebook.com/tools/debug)、Twitter Card Validator 和 LinkedIn Post Inspector 来验证标签是否正常工作。