Open Graph 标签是一类 HTML meta 标签,用于告诉社交平台和即时通讯应用在页面 URL 被分享时如何呈现预览——指定应显示的标题、描述、图片和类型,而不是由平台自行猜测。Open Graph 协议最初由 Facebook 开发,如今几乎所有主流社交和通讯平台都会读取它,因此它成为零售商控制商品页在被分享、收藏或从站外链接时如何呈现的标准方式。对电商而言,设置得当的 Open Graph 标签,决定了被分享的商品链接显示的是吸引人的图片和价格,还是一个残缺、千篇一律的缩略图。
为什么 Open Graph 标签对 Feed 驱动的页面很重要
商品页无时无刻不在被分享,无论是通过顾客口碑、联盟链接、达人帖子还是付费社交广告位,而每一次分享的呈现都基于 Open Graph 标签,而不是访客点击后实际看到的页面内容。没有正确配置标签的商品页可能会显示一个被拉伸的徽标、被截断或无关的描述,甚至完全没有图片——这会拉低一次本可带来免费、高意向曝光的分享的点击率。由于商品页通常是根据填充购物 Feed 的同一目录批量生成的,Open Graph 的值可以直接根据现有商品元数据模板化生成,而无需为每个 SKU 手写,这使其成为大型目录较具扩展性的优化点之一。
Open Graph 标签如何运作
Open Graph 标签以 <meta property="og:..."> 元素的形式位于网页的 <head> 中,其中 og:title、og:description、og:image 和 og:url 涵盖了大多数平台读取的核心预览字段。对于商品目录,这些值通常直接对应已为购物广告和 Meta 目录维护的 Feed 属性——Feed 中使用的同一标题、描述和主图可以填充相应的 Open Graph 标签,使两个展示面保持一致,而无需单独撰写文案。平台和搜索引擎越来越多地将这些结构化标记与更广泛的实体知识图谱交叉比对,以理解页面所代表的内容,这意味着一致的 Open Graph 数据不仅影响眼前的社交预览,还能强化机器对商品的理解。由于这些标签决定了链接在任何被分享之处的表现,它们也是有效内容联合分发中低调但重要的一环——同一件商品可能会出现在多个合作网站或聚合平台上。
示例
<item>
<g:id>SKU-10234</g:id>
<g:title>Organic Cotton Crewneck Sweater - Charcoal, M</g:title>
<g:description>Soft, breathable organic cotton crewneck in charcoal.</g:description>
<g:image_link>https://example-shop.com/img/org-sweater-charcoal.jpg</g:image_link>
</item>
<!-- Open Graph tags on the corresponding product page, templated from the feed -->
<meta property="og:title" content="Organic Cotton Crewneck Sweater - Charcoal, M">
<meta property="og:description" content="Soft, breathable organic cotton crewneck in charcoal.">
<meta property="og:image" content="https://example-shop.com/img/org-sweater-charcoal.jpg">
<meta property="og:type" content="product">
相关概念
由于 Open Graph 的值与现有商品元数据高度对应,最好把它们作为模板来维护,而不是手动任务;它们也有助于让商品身份在更广泛的实体知识图谱中得到一致的理解。它们还在背后支撑着内容联合分发,确保无论商品链接最终在哪里被分享,其呈现和内容都保持一致。
















