是否有标签可以指定 Google+1 中的 Google+1 故事格式?就像 Facebook 的 og-meta 一样?

发布于 2024-11-18 07:04:46 字数 398 浏览 3 评论 0 原文

对于 Facebook,我们有 Open Graph 标签< /a> 允许网站管理员指定如何在 Facebook 上显示故事。

是否有类似 Google +1 按钮的功能,允许网站管理员指定缩略图、说明和标题? Google+ 似乎忽略了 og-meta 标记

Google 个人资料 +1 列表示例,与 Facebook 墙对比

With Facebook we have the Open Graph tags that allow webmasters to specify how the story is displayed on Facebook.

Is there something similar for the Google +1 button, that allows webmasters to specify the thumbnail image, description and title? Google+ seems to be ignoring the og-meta tags.

Example of Google's Profile +1 list, versus Facebook's wall

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(7

旧街凉风 2024-11-25 07:04:46

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+ 活动帖子)包含预览,或者
+片段
,包含页面标题、页面简短描述和缩略图。这些数据是从
以四种方式之一获取目标 URL 的内容,按以下顺序列出
优先级:

Schema.org 微数据(推荐)

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

<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>

开放图协议

如果页面包含标题、图像和内容的开放图谱属性
描述,然后它们将用于 +Snippet。

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

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

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

<meta name="title" content="..." />
<meta name="description" content="..." />

From Google+ help docs, we now have an official answer.

Google uses schema.org microdata to generate rich snippets in search (and in Google+). There's a lot written about schema.org and how it relates to Facebook OpenGraph in these two links:

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

Some important bits:

+Snippet

After +1'ing a page, the user is given the option to share the page to
Google+ via a displayed Share bubble. This share bubble (along
with the resulting Google+ activity post) includes a preview, or
+Snippet
, that contains the page title, a brief description of the page, and a thumbnail image. These pieces of data are extracted from
the target URL's content in one of four ways, listed in order of
precedence:

Schema.org microdata (recommended)

If the page is annotated with schema.org microdata, the +Snippet
will use the name, image, and description properties found on
any schema.org type.

<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 protocol

If the page contains Open Graph properties for the title, image, and
description, then they will be used for the +Snippet.

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

Meta "title" and "description" tags

If the page's element contains and
tags, the +Snippet will use their
content attributes for the title and description, respectively. For
the thumbnail image, the sharebox will attempt to find a suitable
image on the page.

<meta name="title" content="..." />
<meta name="description" content="..." />
小忆控 2024-11-25 07:04:46

如果我在 Google+ 中分享我们的网络应用程序 (restorm.com) 的链接,则标题、说明和图像取自相应的 og: 标签 (og:title, <代码>og:描述,<代码>og:图像)。

这些标签

<title>One Shot Orchestra • Electronic • Music, Concerts & More • 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 & press Infos, live footage & 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&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: titleog:description,而不是来自标题和描述元标记...

If I share a link to our webapp (restorm.com) in Google+ then the title, description and image are taken from the respective og: tags (og:title, og:description, og:image).

These tags

<title>One Shot Orchestra • Electronic • Music, Concerts & More • 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 & press Infos, live footage & 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&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" /> 

end up being shared like this

screenshot of sharing result

So the title and description are definitely taken from og:title and og:description, and not from the title and description meta tag...

网白 2024-11-25 07:04:46

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

Images that are too small or not square enough will not be included in the +Snippet, even if explicitly referenced using schema.org microdata or Open Graph markup. Specifically, the height must be at least 120px, and if the width is less than 100px, then the aspect ratio must be no greater than 3.0.

橪书 2024-11-25 07:04:46

刚刚在另一篇文章中回答了这个问题Google +1 在个人资料中生成了缩略图

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

  1. 开放图标记 http://ogp.me/ - 目前看来添加缩略图的唯一方法是使用 og:image 标签
  2. 普通元标签 即标题、描述
  3. < strong>页面内容如果上述选项中没有设置描述,则描述取自页面上的内容。

希望这有帮助。

Just answered this on another post Google +1 Generated Thumbmail in Profile

Looks Like Google+1 has the following data hierarchy:

  1. Open graph tags http://ogp.me/ - seems at the moment the only way to add the thumbnail is to use the og:image tag
  2. Normal meta tags i.e title, description
  3. Page content if there's no description set in the above options then the description is taken from the content on the page.

Hope this helps.

走过海棠暮 2024-11-25 07:04:46

我正在研究这个问题,但 Google+ 没有获取我的 OG 标签。

当我将 放入 HTML 中时,它开始拾取它们。

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

I am working on this, and Google+ wasn't picking up my OG tags.

When I put: <body itemscope itemtype="http://schema.org/Article"> into the HTML it started to pick them up.

Hope this saves someone some time!

半山落雨半山空 2024-11-25 07:04:46

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

meta og:image works, secret is to have image large enough. It failed at 140x112 and work when I change to bigger thumbnail 511x364

攒眉千度 2024-11-25 07:04:46

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

Google appears to be using the Title and Description of the page, in standard meta tags. It seems to have no way of specifying a thumbnail, however.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文