建站

OpenGraph分享预览怎么配:标题、图片和页面地址要对应

资料核对与更新:2026-10-28 · 阅读约2分钟

网页分享后没有封面或显示旧标题时,先核对Open Graph元数据与图片访问条件,再检查平台缓存,不应只改可见标题。

不同屏幕尺寸的响应式网页设计示意
不同屏幕尺寸的响应式网页设计示意;作者:Muhammad Rafizeldi ( MRafizeldi );许可:CC BY-SA 3.0。主题示意配图,非本文操作截图。 图片来源 · 许可说明

分享卡片与浏览器中的网页标题不是同一个展示过程。平台通常读取页面元数据并缓存结果,因此页面看起来已经更新,卡片仍可能保留旧信息。配置时应让分享信息准确代表这篇文章。

操作步骤

在页面head中设置og:title、og:type、og:image和og:url等基础属性,并按实际情况提供描述。图片使用可公开访问的绝对地址,检查它返回图片内容而不是登录页。文章页不要全部复用首页地址,协议和首选域名也应统一。随后查看原始响应HTML,确认标签确实由服务端输出。

怎样确认处理正确

使用平台提供的预览检查方式重新抓取,记录更新时间,等待缓存刷新。图片长宽比例与大小限制因平台而异,需按目标平台核对;Open Graph本身不能保证每个平台展示相同。验收至少比较首页和两篇文章,确认标题、描述和封面没有串页,同时避免在元数据中写入未公开的草稿信息。

参考资料

资料核对日期:2026年10月28日。以下为官方资料综合整理与操作建议,不代表已经对读者的环境完成实测。

Open Graph协议

MDN元数据

本文新增价值
围绕OpenGraph分享预览提供从现象识别到操作验收的具体路径,补充容易误判的边界和失败情形,帮助读者保留原始证据并判断修改是否有效。