OG 预览

怎么用

1. 按 meta 标签的实际内容填 og:title 和 og:description。
2. 粘贴 og:image URL 和域名；它们只作为文字与卡片品牌信息显示。
3. 输入时两张模拟卡片实时更新：一张 Facebook 风格、一张 Twitter (X) 风格。
4. 不断缩短标题或描述，直到没有内容被截断，再去改页面上的真实 meta 标签。

常见用法

• 上线前检查 —— 确保落地页分享出去时标题符合预期。
• meta 标签打磨 —— 找到卡片开始截断的长度临界点，按这个标准写文案。
• 内容审计 —— 不用去社交网络逐个打开，就能并排比较站点多个页面的卡片。
• SEO 教学 —— 演示各 og: 字段分别控制分享卡片的哪一部分。

常见问题

问：图片区为什么只显示文字而不显示图片？ 答：加载图片就会从你的浏览器发出请求，本工具的设计原则是不发任何请求。这里显示 URL 的文件名，方便确认引用的是哪张图，同时版式仍能看出图片占位大小。

问：模拟卡片和各平台像素级一致吗？ 答：不一致。Facebook 和 Twitter 会不定期改版卡片设计，这只是对比例与文字截断的近似模拟，不是官方渲染器。用它做长度和措辞的快速检查即可。

问：这里看着没问题，真实分享却被截断了，为什么？ 答：线上平台可能用缓存数据、不同字体，或优先读取其他标签。修好 meta 标签后，请用各平台自己的检查器（如分享调试器）刷新缓存并最终确认。