29

有了Facebook我们Open Graph tags,网站管理员可以指定故事在 Facebook 上的显示方式。

按钮是否有类似的东西Google +1,允许网站管理员指定缩略图、描述和标题?Google+似乎忽略了og-meta tags.

Google 的个人资料 +1 列表与 Facebook 的墙的示例

4

7 回答 7

44

Google+帮助文档中,我们现在有了一个官方答案

Google 使用schema.org微数据在搜索(和 Google+)中生成丰富的片段。在这两个链接中有很多关于 schema.org 以及它与 Facebook OpenGraph 的关系的文章:

请参阅:http ://www.google.com/support/webmasters/bin/answer.py?answer=1211158 请参阅:https ://developers.google.com/+/plugins/+1button/

一些重要的位:

+片段

对页面 +1 后,用户可以选择通过显示的共享气泡将该页面共享到 Google+ 。此共享气泡(以及生成的 Google+ 活动帖子)包括一个预览或 +Snippet,其中包含页面标题、页面的简要说明和缩略图。这些数据片段以四种方式之一从目标 URL 的内容中提取,按优先顺序列出:

Schema.org 微数据(推荐)

如果页面使用schema.org微数据进行注释,+Snippet 将使用在任何 schema.org 类型上找到的nameimagedescription属性。

<body itemscope itemtype="http://schema.org/Product">
  <h1 itemprop="name">Shiny Trinket</h1>
  <img itemprop="image" src="image-url"></img>
  <p itemprop="description">Shiny trinkets are shiny.</p>
</body>

开放图协议

如果页面包含标题、图像和描述的 Open Graph 属性,则它们将用于 +Snippet。

<meta property="og:title" content="..."/>
<meta property="og:image" content="..."/>
<meta property="og:description" content="..."/>

元“标题”和“描述”标签

如果页面的元素包含 和 标签,+Snippet 将分别使用它们的内容属性作为标题和描述。对于缩略图,sharebox 将尝试在页面上找到合适的图像。

<meta name="title" content="..." />
<meta name="description" content="..." />
于 2011-11-28T12:23:40.747 回答
12

如果我在 Google+ 中分享到我们的 web 应用程序 (restorm.com) 的链接,那么标题、描述和图像取自各自的og:标签 ( og:title, og:description, og:image)。

这些标签

<title>One Shot Orchestra • Electronic • Music, Concerts & More &#8226; restorm.com</title> 
<link href="https://restorm.com/favicon.ico?116a158" rel="shortcut icon" /> 
<meta name="description" content="Listen to music of One Shot Orchestra for free and browse the Artist's news, events, videos, pictures, shop, booking &amp; press Infos, live footage &amp; much more on restorm." />

<meta property="og:title"        content="One Shot Orchestra" />
<meta property="og:url"          content="https://one-shot-orchestra.restorm.com/" />
<meta property="og:type"         content="band" />
<meta property="og:description"  content="Bangin´ Live Electro aus Bern-Kreuzberg" />
<meta property="og:site_name"    content="restorm.com" />
<meta property="fb:app_id"       content="127577323959237" />
<meta property="og:language"     content="en" />
<meta property="og:image"        content="https://assets3.restorm.com/resources/images/40/40b17a53aa9785fa89c15b06b9fcfd72_643969.jpeg?116a158" />
<meta property="og:video"        content="https://one-shot-orchestra.restorm.com/minipage/minipage.swf?applicationSettingsURL=https%3A%2F%2Fone-shot-orchestra.restorm.com%2Fminipage%2Fsettings.xml&amp;auto=true" /> 
<meta property="og:video:width"  content="300" /> 
<meta property="og:video:height" content="200" /> 
<meta property="og:video:type"   content="application/x-shockwave-flash" /> 

最终被这样分享

分享结果截图

所以标题和描述肯定取自og:titleand og:description,而不是取自标题和描述元标记......

于 2011-07-12T12:00:45.313 回答
4

即使使用 schema.org 微数据或 Open Graph 标记明确引用,图像太小或不够方形也不会包含在 +Snippet 中。具体来说,高度必须至少为 120px,如果宽度小于 100px,则纵横比不得大于 3.0。

于 2012-01-27T19:37:11.197 回答
3

刚刚在另一篇帖子中回答了这个问题Google +1 Generated Thumbmail in Profile

看起来 Google+1 具有以下数据层次结构:

  1. 打开图形标签 http://ogp.me/ - 目前似乎添加缩略图的唯一方法是使用 og:image 标签
  2. 正常的元标记,即标题、描述
  3. 页面内容如果在上述选项中没有设置描述,那么描述来自页面上的内容。

希望这可以帮助。

于 2011-07-13T13:37:49.293 回答
3

我正在处理这个问题,而 Google+ 没有提取我的 OG 标签。

当我把:<body itemscope itemtype="http://schema.org/Article">放入 HTML 时,它开始拾取它们。

希望这可以节省一些时间!

于 2012-10-23T10:40:03.653 回答
2

meta og:image 有效,秘诀是要有足够大的图像。它在 140x112 失败,当我更改为更大的缩略图 511x364 时工作

于 2011-10-12T17:06:45.857 回答
0

谷歌似乎在标准元标记中使用页面的标题和描述。但是,它似乎无法指定缩略图。

于 2011-06-30T18:48:34.137 回答