Google +1 (pronounced “plus one”) is a recommendation button somewhat similar to Facebook like button. Both of them show friends that recommended your post. But while Facebook Like button shows them under the Like button in your post, Google +1 shows them under your post in Google search results.


This tutorial will show you how to add a Google +1 button to every blog post in a Blogger blog. It lets your readers recommend your posts to their Google friends 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.








Let us proceed with the tutorial:

1. Go to Dashboard > Design > Edit HTML.
2. Back up your template.
3. Tick the Expand Widget Templates check box on top right of the HTML window.
4. Find the following code in your HTML, this is the code for your post content:
   <data:post.body/>
5. Paste the +1 button code immediately below (after) it:
   <!-- 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="http://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 -->
6. Configure button
   You can configure by changing the attributes in line 5.

•  Select the size of button by replacing the value of size attribute with a value from the table below.
  

Button size (with count)	Value
	small
	medium
	standard
	tall

•   You can remove the count by changing the value of count attribute from true to false. 

•  Position it on top of post
   Place the button code before (instead of after) <data:post.body/>.
• Position it on the right
  Change the float in line 4 from left to right.