How to Add Google +1 Button to your Blog using Sharebar Plugin

Google’s +1 button is now LIVE and you can implement the code on your blog. Instead of just copy pasting the code on your blog, try achieving the functionality of the +1 button by adding the code to a social sharing plugin.

Install and activate Sharebar before you read any further.

Step 1

Assuming you have installed the plugin and activated it, go to Plugins menu and Click on Sharebar.

<!– Place this tag in your head or just before your close body tag –>
<script type=”text/javascript” src=”http://apis.google.com/js/plusone.js”></script>
<!– Place this tag where you want the +1 button to render –>
<g:plusone size=”tall”></g:plusone>

Step 4

Once you add the code, you should have a screen like this:

That’s all you need to do. Please let me know by commenting below if you run in to any problems implementing the +1 Button.

Hey man! Great little tutorial. I got the +1 button working, but I was wondering if you could share how to make rounded corners on the bar, make it stay more in the center of the screen when scrolling, and how to make it scroll with you smoothly. I know it’s a lot to ask, but I haven’t found the option for that type of customization in the Share Bar settings. Thanks in advance for any help, and bravo again on the tutorial

http://twitter.com/techalam Nizam Khan

That’s really helpful. Thanks for this wonderful post Zahid

Josh Manuel

What a relief. I tried to add the google+1 button sometime ago, and I was told to add some html code to my functions php and doing that caused problems with my website. Unable to even load the site to reverse the changes. I had to log into my hosting control panel to delete the code before my website was able show its content. I’ve been searching for ways to add the button. You really helped me a lot. Thank you