जिजीविषा: How To Add Google +1(plus) Button in Blogger or Blogspot?

Saturday, July 9, 2011

How To Add Google +1(plus) Button in Blogger or Blogspot?

Few days back, Google released its Google +1 (“plus one”) button to compete with Twitter’s Tweet button and Facebook’s Like button. This is a big step towards adding the social aspects to the search results. If you have not incorporate it into your website, do it as soon as possible. Because, This button can generate a potential traffic and exposure to your web site. All your visitor need to have a Google account to use your Google button.

Follow these steps:

Step 1 : First enable share buttons for blogger editing the Blog Posts widget from Page Elements section.

Step 2 : Go to "Edit HTML". Click on "Expand Widget Templates"

Step 3 : Find this and remove it:

<b:include data='post' name='shareButtons'/>

Note : If you can not find above code, then skip that step.

Step 4 : Now add below code just above the <head> tag

<script type="text/javascript" src="http://apis.google.com/js/plusone.js"><br /> {lang: 'en-US'}<br /> </script>

Step 5 : Scroll down to where you see below code:

<div class='post-header-line-1'/>

Step 6 : Now Copy below "Blogger Sharing buttons" code and paste it just below the above code.

NOTE: If you can't find <div class='post-header-line-1'/> in your template, paste "Blogger Sharing buttons" code just before <data:post.body/> .

<b:if cond='data:blog.pageType == &quot;item&quot;'><br /> <div class='post-share-buttons' style='float:right;margin-right:10px;'><br /> <b:include data='post' name='shareButtons'/><br /> </div><br /> </b:if>

This will show blogger sharing buttons below post header in blogger post pages..But if you want to show share buttons below blogger post,then paste your code just after <data:post.body/>.

Also if you want to show share button in every page, then remove the first and last lines form above code.

Step 7 : Now save your template and you are done.

Hey! My friends, If you like my post you can save it using "Save Page as PDF" button below and you can even share them to your friends with social networking buttons provided below this post.