开放图预览工作室

打开图形预览工具

正在加载工作区...

如何从任何 URL 预览 OG 标签

粘贴绝对 https URL,运行“获取元数据”,然后查看合并的标题、描述、图像和目标 URL。展开诊断以确认状态代码、重定向后的最终 URL 以及内容类型。

如何选择 Open Graph、Twitter Card 和后备元标记

对于 Facebook 和 LinkedIn 风格的预览,我们更喜欢 Open Graph 标签,然后在 og:image 丢失时回退到标题标签、元描述、规范 URL 和第一个合适的正文图像。对于 X/Twitter 风格的预览,我们更喜欢 twitter:title、twitter:description 和 twitter:image(如果存在),否则我们会回退到 Open Graph,然后使用相同的通用后备。

常见元数据问题以及解决方法

缺少 og:image 是最常见的共享质量问题 - 添加方形或横向图像 URL。重复或冲突的标签、没有正确基础的相对图像 URL 以及被截断的长标题也很常见。在发布之前使用编辑器测试修复。

如何导出 HTML 元标记或 JSON

成功提取后(或手动填写必填字段后),使用复制 HTML 或复制 JSON,或下载 .html 和 .json 文件。 HTML 代码段中的值被转义,JSON 包含每个受支持字段的源状态。

从公共 URL 获取 Open Graph 和 Twitter 卡片元数据,预览 Facebook、X/Twitter 和 LinkedIn 风格的卡片,覆盖本地字段,以及导出 HTML 元标记或 JSON。

常见问题解答

为什么 Facebook、X 和 LinkedIn 之间的预览有所不同?

每个平台以稍微不同的顺序读取标签,应用自己的裁剪规则,并且可能缓存页面的旧版本。该工作室显示来自合并元数据的一致的本地模板,以便您可以验证结构和复制,而不是像素完美的网络渲染。

这个工具会改变我的实时网站吗?

不会。仅针对当前请求解析获取的 HTML。编辑和导出保留在您的浏览器中(带有用于可共享覆盖的可选 URL 查询参数)。没有任何内容写回到您的站点。

如果我的页面阻止自动提取怎么办?

某些站点向非浏览器客户端返回 403/401。此 MVP 仅支持无需身份验证即可公开获取的 HTML。如果您控制服务器,请尝试暂存 URL 或暂时放宽机器人规则。