Search code examples
facebook-likegoogle-plus-oneschema.orgog-meta

Are there tags to specify the Google +1 story format in Google+ like og-meta for 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


Solution

  • 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="..." />