• Go to Dashboard > Design > Edit HTML and Back up your template
• Check the Expand Widget Templates checkbox on top right of the code window.
  
• Find the following code in your HTML:
  

<data:post.body/>

• Paste the +1 button code immediately below (after) it:

<!-- Google +1 button Start -->


<b:if cond='data:blog.pageType != "static_page"'>


<div style='float:left;padding:10px;'>


<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>


<g:plusone expr:href="data:post.url" size="standard" count="true"></g:plusone>

</div>
</b:if>

button End -->

<!-- Google +1 button ends -->
 

Further Customization

• Select the size of button by replacing the value of size with a value from the table below.

  Table by: bloggersentral.com

• You can remove the count by replacing the value of count from true to false.
• If you want your Google +1 button under the blogger post title then you would have to paste the Google +1 button Code Before <data:post.body/>
  
• If you want to show your +1 Google Button on the right side , simply change float:left to float:right , add the code and save your template.

• Go to Blogger >> Design.
• Add a Gadget.
• Select HTML/JavaScript and paste the following code in it:

<style>

/*  ---------My Blogger Tips Social Media Widget----------- */ 

.social-connect-widget{background:#F5F4EF;border:1px solid #E7E6DE;padding:10px; border-radius:5px; -moz-border-radius:5px;} 
.social-connect-widget:hover{border:1px solid #CBCBC2;background:#FFF} 
.social-connect-widget a{text-decoration:none;font-weight:bold;font-family:Arial,Helvetica,Sans-serif;color:#4B4D4E} 
.social-connect-widget a:hover{text-decoration:underline;color:#F77C04} 
.social-connect-widget img{vertical-align:middle;margin-right:5px;height:32px;width:32;} 
</style>


<div class='social-connect-widget' style='margin-top:0px;margin-bottom:10px;'> 
<a href='http://feeds.feedburner.com/USERNAME'><img alt='RSS Feed' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf_PQBOri9f2q0gs1_uQlOmqWLXGSCpw3Sp9IScyVmr0YlEV5Uiq_ozAkVlDPTKldDb_OCp8jdv8IRnbti25i6Xp2dLh5FRahlPfmUhvhKePClgkOpF6V-XlY6rf8LGTHaR0PVA-mwbuYM/s1600/rss.png"/></a><a href='http://feeds.feedburner.com/USERNAME'>Subscribe to our RSS Feeds!</a> 
</div> 
                        
<div class='social-connect-widget' style='margin-bottom:10px;'> 
<a href='http://twitter.com/USERNAME'><img alt='Follow Us on Twitter!' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeQw2sWrk2nDWDL9nmB9APvvqa7Dp-PG6igBeVvZKLeah1mdR3E7EbeziIZOZKMun3WiM3tcSfN4BQgLZcwXzkUaIOQ7LhTAfwiQ0_RfDFH1T45PidenQh8Fr1gNnZUgr9aDLbBLQkjKmJ/s1600/twitter.png" title='Follow Us on Twitter!'/></a><a href='http://twitter.com/USERNAME'>Follow Us on Twitter!</a> 
</div>
<div class='social-connect-widget' style='margin-bottom:10px;'> 
<a href='http://facebook.com/USERNAME'><img alt='Be Our Fan!' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjtVzhbi7Lz168SGxb_eNzmqWvRqWQq8z0sI0ujB_IfL2oSQPowDmIsnZ6iiN4OEZbA7MeQHS2KceYMCcC5Goj_EpigwuNMI4bElpMwt1S3XazFceu3YW3I2ZF5lnPD9lnbGCZ_wsffL5c/s1600/facebook.png' title='Be Our Fan"/></a><a href='http://facebook.com/USERNAME'>Follow us on Facebook!</a> 
</div>

• Before saving, Proceed to the next step.

Step 2: Add your own values!

• http://feeds.feedburner.com/USERNAME with your own Feedburner id.
• http://twitter.com/USERNAME with your own Twitter id.
• http://facebook.com/USERNAME with your own Facebook fan page link.

1. Go to Blogger >> Design.
2. Add a Gadget.
3. Select HTML/Javascript and paste the code below within that.

<style class="text/css">
table
{
border-bottom: 1px solid #E6E6E6;
float: center;
width: 280px;
margin:10px 0 0 20px;
}
.subicons
{
border-right: 1px solid #E6E6E6;
}
.Fadeout {
filter:alpha(opacity=100);
opacity: 1.0;
border:0;
}
.Fadeout:hover{
filter:alpha(opacity=80);
opacity: 0.8;
border:0;
}
</style>
<div class="table">
<table>
<tr>
<td><div class="subicons"><a class="Fadeout" href="http://www.facebook.com/pages/My-Blogger-Tips/220561111314693" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhgsZ9n_a8OSuc_KmYGDFdK6z0_KY3RPYI_9caHn__46iplKJBAdKRizbxbzZ8yX6Nc9blVAsMW9ziZWLF4wedaNpXJ-0THCNuPD51D9QAmbk8MHfzcD6FGK2Qz2k9vflXYkjg-mUx_8va/s1600/facebook-48.png" /></a></div></td><td><div class="subicons"><a class="Fadeout" href="http://twitter.com/mybloggertips" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoxHp6Fwst03Q-FnKxFACb5smdOxYPc8MgNgbFcz6bZ8TvPwQEj74RFBnFSp68_0Rj5rymHECtp3VNc7qpRkXWaYYbTWYivgotp9VBzD7xQMi5H-DvCxuEUhvi13gpa4ZR1761pbjiWMu7/s1600/twitter-48.png" /></a></div></td>
<td><div class="subicons"><a class="Fadeout" href="http://feeds.feedburner.com/mybloggertips" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-QcPM1cBqJWscl6G7XdF_MrSmaGLgtymF-FBNEUquzPUciJP4dx3fb7YmoFMcILi1quiOEEVEA4m9qiQFilLC1weldsjFjpilbBPn60lKrhf3dIMOaKxdJpsynZdjFt5CfA03GJN4UQjr/s1600/rss-48.png" /></a></div></td>
<td><a class="Fadeout" href="https://plus.google.com/110875602250977569192/posts" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXPSump8ptgcs2JYih80NtxAss4gnUVlH6ErG2TCkfQYvg94GqgvKGbxkspclGK7c68o6r7OtVXVtp1o6PkQX1UeYGE3n5fwqdaN3fWW-JwRjRW5v2569rCmDRb5TZFcm-lBUxAjzpyv94/s1600/google-48.png" /></a></td>
</tr></table>
</div>

<style>
.rssbuttontable
{
border: 1px solid #E6E6E6;
background: #FFDCB1;
float: center;
width: 270px;
margin-left:10px;
padding: 5px 5px 5px 5px;
border-radius: 5px;
-moz-border-radius: 5px;
height: 35px;
float: left;
display: inline;
margin-top:5px;
margin-bottom:5px;
}
input.Subscriberssbutton
{
background:-moz-linear-gradient(top,#F88017 0%,#FF6600 100%); background:-webkit-gradient(linear,left top,left bottom,from(#F88017),to(#FF6600)); 
border: 1px solid #FF6600; 
text-transform: none; 
font:bold 13px arial;
 color: #fff; 
height: 30px;
 padding: 4px 2px 5px 2px;
 margin: 0px 0 0x 0px;
 border-radius: 5px; 
-moz-border-radius: 5px;
 -webkit-border-radius: 5px;
 cursor:pointer;
display: inline;
}
</style>
<table class="rssbuttontable">
<tr>
<td>
<a rel="nofollow" href="http://feeds.feedburner.com/mybloggertips"><img src="http://feeds.feedburner.com/~fc/mybloggertips?bg=FF6600&amp;fg=444444&amp;anim=1" height="26" width="88" style="border:0" alt="" />
</a>
</td>
<td>
<input value="Subscribe to Get Updates" class="Subscriberssbutton" type="button" onclick="window.open(&#39;http://feedburner.google.com/fb/a/mailverify?uri=mybloggertips&#39;, &#39;popupwindow&#39;, &#39;scrollbars=yes,width=650,height=570&#39;);return true" /></td></tr></table>

Step 2: Add your Own values!

• http://www.facebook.com/pages/My-Blogger-Tips/220561111314693 with your facebook fanpage. (If you don't have one, create it here)
• http://twitter.com/mybloggertips with your twitter page.
• http://feeds.feedburner.com/mybloggertips with your feedburner link.
• https://plus.google.com/110875602250977569192/posts with your Google + page.
• mybloggertips (from the lower part of the code above) with your feedburner id. It appears 3 times, change 'em all.