Adding Google +1 Share Button in Blogger Templates

The Google +1 button is like a bookmark that you can share with your online friends. It's like a 'tagging' feature that lets you share interesting stuffs with your buddies. Some compare this with Facebook's 'Like' button. Click here to learn more about this button.

You can add this button to your posts, so that your readers can easily +1 your posts (yes, '+1' is the latest verb in town). In designer templates, this button will automatically show up (if your template is not messed up). But in some templates, like Minima for example, you need to add some lines into your template to make the button appear. Some of your designer templates might be missing the button too, and the fix in the tutorial will take care of it.

I am aware of other ways on how you can add the +1 button. The fix in this post is an alternative for those who prefer to work with HTML rather than Javascript. I've not tested it on heavily modded custom templates. Feel free to try it and let me know how it goes. It works well in fixing your designer templates (templates that you can find in Template Designer) and Layout templates (basically Blogger 'approved' templates.).

Step 1:

I have to write two set of instructions for each steps, as some of you are using the default layout, and some of you are using the new layout -Grrr.

If you have not enabled your share buttons, it's time to do so now.

In the default layout: Go to Dashboard - Design - Page Elements - Blog Posts - Edit - Check the third box from bottom (Share Buttons) - Save.

In the new layout: Go to Dashboard - Layout - Blog Posts - Edit - Check the fourth box from bottom - Save.

Step 2: 

In the default layout: Go to Dashboard - Design - Edit HTML - Check the box next to 'Expand Widget Templates'.

In the new layout: Go to Dashboard - Template - Edit Template - Expand Widget Templates.

Find for <b:include name='feedLinks'/> - Paste the following code directly below this line:

<b:if cond='data:top.showDummy'>
    <data:top.dummyBootstrap/>
  </b:if>

The code in place:

There you have it. An easy fix for your +1 button.