如何使用“og”(开放图谱)元标签进行 Facebook 分享

问题描述 投票:0回答:3

Facebook 从我的网站获取所有图片。

我只想分享该页面上的一张图片。

我听说过

og
元标记,但我不知道如何放置它。

facebook-opengraph meta-tags
3个回答
365
投票

用途:

<!-- For Google -->
<meta name="description" content="" />
<meta name="keywords" content="" />

<meta name="author" content="" />
<meta name="copyright" content="" />
<meta name="application-name" content="" />

<!-- For Facebook -->
<meta property="og:title" content="" />
<meta property="og:type" content="article" />
<meta property="og:image" content="" />
<meta property="og:url" content="" />
<meta property="og:description" content="" />

<!-- For Twitter -->
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="" />
<meta name="twitter:description" content="" />
<meta name="twitter:image" content="" />

根据您页面的内容填写content="..."。

欲了解更多信息,请访问 2013 年每个网页应具备的 18 个元标签


44
投票

Facebook 使用所谓的“开放图协议”来决定共享链接时显示哪些内容。 OGP 会查看您的页面并尝试决定显示哪些内容。我们可以伸出援助之手,实际上告诉Facebook 从我们的页面中获取什么。

我们这样做的方式是使用

og:meta 标签。



标签看起来像这样 - 

<meta property="og:title" content="Stuffed Cookies" /> <meta property="og:image" content="http://fbwerks.com:8000/zhen/cookie.jpg" /> <meta property="og:description" content="The Turducken of Cookies" /> <meta property="og:url" content="http://fbwerks.com:8000/zhen/cookie.html">

您需要将这些或类似的元标记放置在 HTML 文件的 
<head>

中。不要忘记将这些值替换为您自己的值!


有关更多信息,您可以在其文档中阅读有关 Facebook 如何使用这些元标记的所有信息。这是那里的教程之一 -

https://developers.facebook.com/docs/opengraph/tutorial/

Facebook 为我们提供了一个很棒的小工具来帮助我们处理这些元标记 - 您可以使用
调试器

来查看 Facebook 如何查看您的 URL,它甚至会告诉您是否存在问题。 这里需要注意的一件事是,每次更改元标记时,您都需要再次通过

Debugger

提供 URL,以便 Facebook 清除其服务器上缓存的有关您 URL 的所有数据.


28
投票
http://www.groovymeta.com

为了进一步回答这个问题,

OG

标签(开放图谱)标签的工作方式与元标签类似,应该放置在 HTML 文件的 HEAD 部分。有关如何有效使用 OG 标签的更多信息,请参阅

Facebook 的最佳实践

© www.soinside.com 2019 - 2024. All rights reserved.