本页面由 AI 翻译,尚未经过母语人士审校。 阅读英文版

Open Graph 预览

当你在 Facebook、LinkedIn、WhatsApp 或 Slack 上分享链接时,应用会读取 Open Graph 标签来生成卡片。输入你的值(或粘贴页面 <head> 的 HTML)即可预览通用卡片,在发布前发现缺失的图片或过长的文本。

…或预览本地图片
大致预览。实际的搜索和社交平台显示效果会因设备、语言和平台更新而不同。

完全在浏览器中运行。你的输入内容和文件不会上传到任何服务器。

使用方法

  1. 输入标题、描述、网址和图片(网址或本地文件),或粘贴现有 HTML 并点击“读取标签”。
  2. 查看预览和警告。
  3. 将 og: 标签复制到你的页面。

示例

产品发布

在发布公告前,检查 1200 × 630 的图片不会被裁切得很别扭。

现有页面

粘贴页面源代码,查看缺少哪些 og: 标签。

隐私

完全在浏览器中运行。你的输入内容和文件不会上传到任何服务器。 浏览器中保存了哪些内容(仅收藏和历史记录),请参阅隐私政策。 隐私政策

你可以自己验证:打开浏览器的开发者工具,选择“网络”(Network)标签,然后使用工具。你的文件不会出现在任何上传请求中。此页面保存为离线可用后,你还可以断开网络继续使用。 广告和匿名访问统计在启用时会发出各自的请求,但绝不会接收你的文件或文本。

常见问题

会抓取我的线上页面吗?

不会。浏览器禁止网页读取其他网站的 HTML,而我们也不使用服务器。请粘贴 HTML 或自己输入数值。如果你输入了图片网址,浏览器会直接加载该图片来显示。

什么图片尺寸效果最好?

普遍推荐 1200 × 630 像素(约 1.91:1)。由于部分应用会裁切成正方形,请让重要内容远离边缘。

这和 Facebook 显示的完全一样吗?

不是。这是中性的近似效果。每个平台对卡片的样式和截断方式都不同,而且会随时间变化。

相关工具

全部SEO 工具
Twitter / X 卡片预览预览 X(Twitter)的 summary 卡片或大图卡片,查看文本和图片建议,并生成 twitter: meta 标签。
Meta 标签生成器为页面生成规范的 HTML meta 标签:标题、描述、canonical、robots、Open Graph 和 Twitter Card,并提供长度建议。
图片尺寸调整将 JPG、PNG 和 WebP 图片调整为精确的像素尺寸或按百分比缩放,可选择锁定宽高比。
网站图标生成器从一张图片或一个字母生成完整的网站图标套件:favicon.ico、16–512 px 的 PNG、Apple Touch 图标、Web 清单和 HTML 标签,打包为一个 ZIP。

搜索工具