Google +1 Plus One Button For Blogger

Google plus is steadily gaining popularity as an emerging social network and just like the facebook like button, facebook comment box or large share buttons, Google +1 is definitely one of the social networking widget you must have on your blog. With google +1 (pronounced plus one), your blog stands to get more traffic from google’s newly introduced social search and your blog has the chance of a higher page rank because according to google, page rank algorithm is now linked all activities taking place on a page.

Adding google +1 button to blogger is quite easy, simply follow these steps and you’ll be done in a couple of minutes.

1. Login to your blogger account

2. Go to Design > Edit HTML

3. Be sure to back up your template in case something goes wrong. You can easily resore it back.

4. Check Expand Widget Template

5. Press Ctrl + F on your keyboard and search for the following code:


6. Immediately after this, paste the code below:

<!-- Google plus +1 button For Blogger Start -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='float:left;padding:5px;'>
<script src='' type='text/javascript'/>
<g:plusone count='true' expr:href='data:post.url' size='standard'/>
<!-- Google plus +1 button For Blogger Start -->

This makes the button appear after your blog posts. If you want the google +1 (plus one) button to appear above your blog posts, then paste the code right before <data:post.body/>

Explanatory Note

-The code above is meant to show the Google +1 button on post pages only. You can remove the third and eight part of the code if you intend to show it on static pages as well.

– The left boldly written in red in the code can be changed to right depending on your desired position.

-You can decide not to show count by changing the count attribute set to true by default to false

-The button comes in various sizes, the standard button is what is used on this blog but you can decide to make it larger or smaller by changing the size attribute set to standard by default to any of these below:

– If you’re using a magazine style template or more than one <data:post.body/> appears in your template, you try the second or third one but this is not fixed for all templates. Try it on all occurences till you get your result. If the tweak worked for you then recommend us to your friends on Google Plus social network!

Filed Under: Blogger

Author: Don Caprio

Don Caprio is a full time blogger / web designer living in Nigeria and apart from blogging, my other obsession is music. I'm a self-confessed Tupac fan, an iOS lover, an Android user, a Windows 8 power user, a writer with a 5-year old unfinished novel... and the list goes on and on. You can add me on Facebook, follow my updates on Twitter or add me to your circles on Google+! By the way, if your blog needs a custom design, you can contact me here...


  1. nodas says

    If you want to increase your site's SERP you should buy google +1 from this trusted seller.
    Only the best level of service at the lowest prices is provided by this company
    They only deliver real, quality +1 votes to your account. Plus Ones are added

    manually by their team to ensure the best quality. No bots used, ever!

  2. says

    Hello! Nice post! In my blog I described how to add Google +1 Button to every WordPress blog post in respect to iNove theme. I added the +1 button manually editing php files. Probably, it could be useful for someone. The article is here – WordPress: How to add Google +1 Button to WordPress blog post. Thanks!

Share Your Comments & Feedback:

Please do NOT use keywords in the name field because they won't be linked to anything anyway...just use your real name. Let's try to have a personal and meaningful conversation.

Commenting Note(s):
To insert code into comments, use: [php]code in here...[/php]
Some HTML tags allowed: <strong>, <em>, <del>, etc. (Just don't overdo it, please!)