Menu
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.
476
Open Graph meta tags are snippets of code that control how URLs are displayed when shared on social media. They're part of Facebook's Open Graph protocol and are also used by other social media sites, including LinkedIn and Twitter (if Twitter Cards are absent). You can find them in the <head> section of a webpage.
You can optionally set metadata tags in your product feed files. This enables Facebook to attribute catalogs using this feed to your app. Once a catalog is attributed to your app, the meta tag is not required in subsequent feed uploads to that catalog.
Go to your business account settings, in the "Brand Security" section, click on Domains. Click Add, enter a domain, and click Add Domain. Click on the added domain and go to the “Meta Confirmation” tab. Select the option to validate your domain using a meta tag.
og:image : This should be a link to an image that you'd like to represent your content. It should be a high resolution image that the social networks will use in their feeds. og:url : This should be the URL of the current page.
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, anddescriptionproperties 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="..." /> 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
So the title and description are definitely taken from og:title and og:description, and not from the title and description meta tag...
42
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
