Sep 21, 2011

Label: , ,

Add Google +1 button to Blogger

Google +1 is a recommendation button somewhat similar to Facebook Like button. Both of them show friends that recommended your post. But while Facebook Like shows them under the button in your post, Google +1 shows them under your post in Google SERP (search engine results pages).

This tutorial will show you how to add a Google +1 button to every blog post in a Blogger blog. It allows your readers to recommend your posts to their Google friends and contacts right from your blog post.

This button will +1 the containing post, regardless the page you are at. It will work on both multi-post pages (home page, archive etc.) and individual/post page etc. You will have an option whether to include a counter or not.

+1 is as simple on the rest of the web as it is on Google search. With a single click you can recommend that raincoat, news article or favorite sci-fi movie to friends, contacts and the rest of the world. The next time your connections search, they could see your +1’s directly in their search results, helping them find your recommendations when they’re most useful.

If you want to +1 search results and search ads earlier, you can opt in through our experimental search site. To see recommendations from your friends and contacts in Google search, make sure you’re signed into your Google Account.

If you’re a webmaster, you can get the +1 button code and learn more about implementation on our +1 webmaster site.

Now if you want to add Google +1 Button to your Blog (Blogspot) Blog then follow the procedure given below:

Login into your Blog. Go to Blogger Dashboard > Design > Edit Html. Now Click on “Expand Widget Template”. Now Search for <data:post.body/> and just above it add the following code.

<!-- Google +1 button Start -->
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<p></p>
<div style='float:left;padding:10px;'>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone expr:href="data:post.url" size="standard" count="true"></g:plusone>
</div>
</b:if>
<!-- Google +1 button End -->
Good luck.


Source:  http://bungtutor.blogspot.com/2011/08/add-google-1-button-to-blogger.html

Related Posts





No comments:

Post a Comment