社交分享预览生成器
Open Graph + Twitter Card 标签,附带实时 Facebook/Twitter 风格预览卡片
四个平台,看清分享卡的真实效果
Facebook、X、LinkedIn 和 WhatsApp 渲染 OG 标签的方式各不相同——四张模拟图一次看全,发布前先把最弱的修好。
一个表单两套标签
面向 Facebook、LinkedIn 和 Slack 的 Open Graph 标签与面向 X 的 Twitter Card 标签,从同一个标题、描述、图片和 URL 一起生成。
发布前的卡片预览
预览卡以 1.91:1 比例渲染图片,连同域名、标题和描述——用户分享链接时看到的真实版式,上线前即可确认。
两种卡片变体可选
选择 summary_large_image 全宽图片卡或精简的 summary 卡,生成器会输出与之匹配的 twitter:card 值和标签。
常见问题
为什么要同时生成 Open Graph 和 Twitter Card 标签?
当页面缺少专属的 twitter:* 标签时,Twitter/X 会自动回退使用 Open Graph 标签,因此实际的分享卡片其实共用同一套字段——分开填写只会重复输入相同的标题/描述/图片。
图片应该用多大尺寸?
1200×630px(约 1.91:1 的比例)是 Facebook、Twitter/X、LinkedIn 和 Slack 上“summary_large_image”卡片的安全推荐尺寸——尺寸过小或裁切比例不合适的图片,在各平台上可能会被不可预测地裁剪。
我的内容会被上传到别处吗?
不会——一切都通过纯 JavaScript 在你的浏览器本地运行,你输入的内容不会发送到任何服务器。
各平台读取什么
| 平台 | 主要来源 | 图片比例 |
|---|---|---|
| Facebook / LinkedIn | og:title、og:description、og:image | 1.91:1(最小 200×200) |
| X / Twitter | twitter:card,否则回退 OG | 大图 2:1,summary 1:1 |
| og:title/image(描述常被隐藏) | 近方形裁切 |
自动标记尺寸不足的图片、缺失的尺寸声明标签(缺了会触发重新抓取),以及超出各家网络截断点的标题。
相关工具
什么是社交分享预览生成器?
当有人把链接分享到 Facebook、X、LinkedIn 或 Slack 时,平台会读取 meta 标签——多数社交网络读 Open Graph,X 读 Twitter Card——拼出一张带图片、标题和描述的卡片。没有这些标签,卡片就会变形,甚至只显示一条光秃秃的 URL,点击率大受影响。这个工具用一张表单同时生成两套标签,并实时渲染预览卡片,让你在分享之前就看清链接在任何平台上的样子。市场人员、内容团队和站长每次上线前都会用到它。
它能生成什么
- 🖼️ 一套字段同时生成 Open Graph 和 Twitter Card 标签
- 📱 输入时实时显示 Facebook/Twitter 风格的预览卡片
- 🗂️ 为 X 选择 summary 或大图卡片类型
- 🔗 支持 og:url 和 og:site_name
- 📋 合并好的、可直接粘贴的标签块
分享前什么时候该检查
- 上线会被大量分享的产品页或落地页
- 活动发布前确认文章链接的展示效果
- 检查所选图片按 1.91:1 比例裁剪后是否好看
- 排查分享卡片坏了几个月的站点
一切都在浏览器本地生成,不上传任何内容。一个平台特性需要了解:社交网络会缓存 URL 的元数据,添加标签后,可能需要用该平台的调试工具刷新缓存,新卡片才会显示。
最后更新 · 2026-09-01