<!-- Open Graph --> <meta property="og:title" content="My Amazing Article" /> <meta property="og:description" content="A short, compelling description shown when this page is shared on social media platforms." /> <meta property="og:url" content="https://example.com/articles/my-article" /> <meta property="og:image" content="https://images.unsplash.com/photo-1517694712202-14dd9538aa97?w=1200&h=630&fit=crop" /> <meta property="og:site_name" content="Example Site" /> <meta property="og:type" content="article" /> <meta property="og:locale" content="en_US" /> <!-- Twitter Card --> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:site" content="@example" /> <meta name="twitter:title" content="My Amazing Article" /> <meta name="twitter:description" content="A short, compelling description shown when this page is shared on social media platforms." /> <meta name="twitter:image" content="https://images.unsplash.com/photo-1517694712202-14dd9538aa97?w=1200&h=630&fit=crop" />
关于 Open Graph Meta 生成器
当链接被分享到微信、Twitter、LinkedIn 或 Slack 时，能否显示出标题、描述和大图，取决于页面头部的 Open Graph 标签。本工具在浏览器本地根据你填的标题、描述、图片、URL、类型等字段，生成成套的 og: 与 twitter: meta 标签代码，直接贴进 head 即可。所有处理均在浏览器本地完成，无需安装任何软件，它适合专注优化社交分享卡片，让链接在微信、Twitter、LinkedIn 等地显示出漂亮的标题、描述与大图。建议同时补上图片尺寸与站点名称，社交平台抓取时会更稳定；改完标签后可用平台自带的调试工具重新抓取一次，让修改尽快生效，分享卡片在群聊与信息流里的呈现也会更统一，避免旧缓存继续显示错图或过期标题。
使用方法
- 打开「Open Graph Meta 生成器」
- 输入或粘贴待处理的内容
- 根据需要调整输出选项
- 点击「运行」按钮，结果实时显示
- 复制或导出结果
使用场景
- 分享卡片 — 为文章或落地页生成 og 标签，让链接在社交平台展示大图标题预览。
- Twitter 大图 — 配好 twitter:card 为 summary_large_image，让推文展示醒目横幅卡片。
- 多语言站 — 为不同语言页面分别生成带 og:locale 的标签，提升海外分享效果。
- 电商商品 — 用 og:type 为 product 的标签，让商品链接分享时带上图片和标题。
- 批量套用 — 先生成一份标准模板，再为站内各页替换标题图片字段快速套用。
常见问题
Open Graph 标签和普通 meta 标签有何不同？
Open Graph 是 Facebook 提出、被各社交平台广泛采用的协议，用 property="og:*" 控制分享预览；而本站的 Meta 标签生成更偏向 SEO 的 description、keywords、viewport 等通用标签，两者用途不同。
og:image 有什么尺寸要求？
推荐使用 1200x630（约 1.91:1）的图，多数平台据此裁切；图过小会被忽略或显示为小图。最好用绝对 URL 并确保图片可被抓取器公开访问。
为什么改了标签分享还显示旧内容？
社交平台会缓存抓取结果，需要用对应的调试器（如 Facebook 分享调试工具、Twitter Card Validator）重新抓取刷新缓存，才会显示新内容。
twitter: 标签是必须的吗？
不是必须，但加上能让 X/Twitter 显示更理想的卡片样式。Twitter 在缺少 twitter: 标签时会回退读取 og: 标签，两者同时提供最稳妥。
og:url 应该填什么？
应填该页面的规范绝对地址（含 https），作为内容的唯一标识，避免带跟踪参数的多个 URL 被当成不同页面，影响分享统计聚合。