最全open graph protocol（开放图谱协议） 介绍操作指南

Posted 2023-03-25

参考技术A 1.什么是open graph protocol

2.open graph protocol 的重要性

3.如何设置open graph protocol

4.测试调试open graph protocol

什么是open graph facebook（facebook开放图谱）

Open Graph Protocol（开放图谱协议），简称 OG 协议。它是 Facebook 在 2010 年 F8 开发者大会公布的一种网页元信息（Meta Information）标记协议，属于 Meta Tag （Meta 标签）的范畴，是一种为社交分享而生的Meta 标签。就是来标注页面的类型和描述页面的内容。

说了这么久，那么到底是什么呢？看下图两个对比图，一个是有设置open graph protocol,一个没有，通过对比，我们可以看出，有设置的，会在页面上完美展现出 标题/图片/描述/url等，但是没有设置的就没有了，只是一条URL，然后会显示标题跟图片URL。两者一对比，有设置OG协议稳稳的赢了几条街了。大家可以自己去随便分享一下自己网站的链接看一看，是否有设置，或者是使用  https://www.woorank.com/ 中的structured data 看一下有没有，PS 这个网站还可以检查自己的网站有什么其他问题之类的

有设置OG协议的

没有设置OG协议的

为什么需要设置OG协议？

看了上图OG的介绍，我们应该知道，SNS是当前必不可少的一部分了，如果分享出去的链接长成那个样子，想必后面的营销效果也会大打折扣，所以独立站网站应该要设置OG协议，OG协议不仅支持Facebook，还支持大部分的SNS，比如twitter，LinkedIn，pinterest等等都是认这个OG协议的。所以没有设置OG协议的社交媒体营销者要赶快动手搞起来。

如何设置open graph protocol

那么要如何设置呢？

如果你的建站系统是用wordpress，那么直接安装yoast seo插件就可以了，直接设置就可以了。

如果是在Shopify中设置Open Graph标签呢？

大多数Shopify主题从变量中提取OG标签，比如你的标题标签为og:title，特色图片为og:image。您可以通过Shopify的用户界面自定义的唯一标签是全站的og:image。转到  Online Store > Themes > Customize > Theme settings > Customize > Social media > select an appropriate image .设置即可。

如果是WIX呢？

在Wix中设置Open Graph标签

Wix从其他变量中提取常见的OG标签，比如页面的元标题和描述。你可以在 “社交分享 “设置中自定义每个页面的OG标题、描述和图片。

您还可以设置自定义全站的OG图片。进入主菜单上的 “设置”>”社交分享”。

总的来说，Wix添加OG标签超级简单，因为不需要编码。

如果是opencart?找你家的程序员搞吧。

测试调试open graph protocol ​设置完成OG协议，接下来就是要测试一下是否成功了。使用以下工具进行测试：

Facebook Sharing Debugger

Twitter Card Validator

LinkedIn Post Inspector

如果网站有好几百个页面了，可以使用  https://ahrefs.com/site-audit 进行检查，看一看页面有什么问题之类，也可以使用其他的SEO工具进行检测。

Facebook Open Graph，提交故事评论

【中文标题】Facebook Open Graph，提交故事评论

【英文标题】：Facebook Open Graph, submit review of story

【发布时间】：2013-05-29 08:49:08

【问题描述】：

我开始使用 facebook 开发并尝试使用开放图创建故事。 我的故事是“[User] [Recommands] a [Partner]”，我已经创建了对象（Partner）和动作（Recommand）。 关键是当我要求 FB 审查我的行为时，我收到了以下消息：

感谢您对提交的内容进行更改。此操作类型仍然不符合我们可供用户使用的标准。以下是您需要对操作类型进行的其余更改：

需要向用户明确说明您将在 Facebook 上发布故事，并且您将在实际发布故事之前获得他们的许可。操作不得混淆或误导，并且应准确代表用户在您的应用中执行的操作。 “partager”（分享）按钮不应触发“推荐”操作，请更改您的 UEX，以便用户清楚将执行哪个操作。

您完成更改后，我会在 3 个工作日内审核您提交的内容。

我不太明白“需要让用户清楚您将在 Facebook 上发布故事”是什么意思。这是否意味着我需要使用对话框发布 Open Graph 故事？我以为我们不能再这样做了... 如果你有使用 Open Graph 的个性化故事的好例子，请与我分享，以了解 FBook 的期望。

有人知道“改变你的UEX”是什么意思吗？我做了一个快速的谷歌研究，但没有找到有意义的答案......

谢谢！ 流量

【参考方案1】：

UEX 表示用户体验，有时也称为 UX。这是用户与您的应用程序交互的方式。

他们的意思是他们不希望用户点击一个“分享”按钮，然后在他们的 FB 时间线上发布一些内容，上面写着他们“推荐”一些东西。所以，用户认为他们只是在分享，但突然间他们也在推荐它。 Facebook 想要你的按钮（或一些文本或其他指示器）显示“推荐这个！”。这让用户知道他们正在向他们的朋友推荐一些东西。

或者，相反，您可以将 Open Graph 操作更改为“共享”。