How To Add Official Google+ Badge/Widget To Blogger/Blogs

1. Sign into Google+, and go to Google+ badges page. Now, in Google+ user section, you can choose your profile, page or community. In other options, you may select as of your need.
   *If you want to add badge for your community, then go to your community page, and copy the link , and paste that URL to Google+ user section. Below is a preview for adding a Google+ page badge.
   
   
   
   
   Make sure, if you are using badge for your community pages, you are selected the correct URL. For example, my community page URL is https://plus.google.com/u/0/communities/116707396900789053463. If you have pasted the correct URL, you will see the preview in the right side. to select the correct Google+ page URL. For example, my page URL is https://plus.google.com/u/0/100086246339880387720/posts. You will also see the code snippet below to your preview that you to paste it into your blogs.
2. The code will be divided into two parts.
   
   
   
   
   One is, <!-- Place this tag where you want the badge to render. --> 
   Second is, <!-- Place this tag after the last badge tag. -->
   
   Now, copy the Second Part as shown in the preview, and sign in to Your Blogger Dashboard --> Choose you blog --> Template --> Edit HTML find the code (using ctrl+F) </head>, and paste the Second Part just above </head>.
   
   Now, copy the First Part and paste this tag where you want to show your Google+ Badge. For example,
   
   In Sidebar: paste First Part code into your sidebar widgets by going to Blogger Dashboard --> Layout --> Add a Gadget(choose from sidebars) --> HTML/JavaScript (Choose under pop up window) and paste your code and click on Save.
   
   In Content Above/Below: Sign in to Your Blogger Dashboard --> Template --> Edit HTML find the code (using ctrl+F) <data:post.body/>, and paste First Part code just before <data:post.body/> code to display on above the content area. If you want to show it below to content area, paste First Part code to below <data:post.body/>, and finally click on Save. If you are using read more hack on your Blogger blog, you would see <data:post.body/> code two times in your blog, so try for each and look at your blog to find out which is suitable for you.