工具
Open Graph 与 Twitter Card 预览
粘贴 HTML 或 meta 标签，在浏览器里预览 Open Graph 卡片和 Twitter 卡片。页面只读取你粘贴的标签。
Open Graph 卡片
vaneform.com
Vaneform traffic checker
Estimated monthly visits for a public domain, with the month and confidence kept on the figure.
Twitter 卡片
Vaneform traffic checker
Estimated monthly visits for a public domain, with the month and confidence kept on the figure.
vaneform.com
粘贴内容里读到的标签
| 标签 | 值 |
|---|---|
| og:title | Vaneform traffic checker |
| og:description | Estimated monthly visits for a public domain, with the month and confidence kept on the figure. |
| og:image | https://vaneform.com/og-en.png |
| og:url | https://vaneform.com/ |
| og:type | website |
| og:site_name | Vaneform |
| twitter:card | summary_large_image |
| twitter:title | Vaneform traffic checker |
| twitter:description | Estimated monthly visits for a public domain, with the month and confidence kept on the figure. |
| twitter:image | https://vaneform.com/og-en.png |
检查
- Open Graph 的标题、描述、图片和 URL 都在，图片与 URL 是绝对地址，并且写了 twitter:card。
两张卡片各用哪些字段
Open Graph 卡片使用 og:title、og:description、og:image 和 og:url。标题下的主机名来自 og:url。Twitter 卡片在有 twitter:title、twitter:description、twitter:image 时用这些标签，否则沿用 Open Graph 的值。twitter:card 为 summary_large_image 时图片在文字上方；为 summary 时图片在文字旁边。没有 twitter:card 时，Open Graph 卡片仍按 og: 标签绘制。
把示例换成即将发布页面的 head。预览展示文本框里的字符串。页面不会请求那一页，平台在抓取线上 URL 之后仍可能裁切标题或忽略图片。站内的搜索结果预览用来看 title 和 meta description 在 Google 结果里的长度。