Google +1 like button let people recommend or like your content on Google +. It is available in four size small, medium , standard and tall. Here is the snap shot.
You can easily add Google +1 like button by following these steps:
1. Go to https://developers.google.com/+/plugins/+1button/ , click on the size button (whichever size you want).
2. Select the Annotation, available option are inline, bubble and none.
3. Now Select Language. (English, French....etc)
4. Now click on Advanced options, type URL which you want to like by the user in URL to +1 textbox (here i put my blog URL).
Your Google +1 like button is ready to use with default snippet. Here is the snap shot:
Now add generated snippet in your site or blog according to this:
1.Place this tag where you want the +1 button to render.
<div class="g-plusone" data-size="medium" data-href="http://ourtechspace.blogspot.in"></div>
2. Place this tag after the last +1 button tag.
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
You can get above code from https://developers.google.com/+/plugins/+1button/ itself (See at the right hand side top corner). Here is the screen shot.
Now customize snippet (Image, description, title), these will be display on user's Google + account when user will like. Here are the steps to add this:
1. Select Page type (like article, blog, book..etc) .
2. Give the Title .
3. Give Image URL (give the path from where you are taking image).
4. Give Description.
5. Select Markup location (head or body). This mean where you want to add the generated snippet in head or body. I select head here.
6. Update your html tag to include the itemscope and itemtype attributes.
<html itemscope itemtype="http://schema.org/Article">
7. Add the following three tags inside head.
<meta itemprop="name" content="Technology Space">
<meta itemprop="description" content="This blog related to all Technology">
<meta itemprop="image" content="https://mysite.com">
Now customization done. Here is the screen shot.
When user like your URL then it will be look like below, on their Google+ profile.
Thank you . Please add your comments.
0 comments:
Post a Comment