tomai
登录
免费 · SEO工具

社交分享预览生成器

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 / LinkedInog:title、og:description、og:image1.91:1(最小 200×200)
X / Twittertwitter:card,否则回退 OG大图 2:1,summary 1:1
WhatsAppog: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

相关工具