1. Log in to blogger account and Click drop down.

2. Now select "Template"

3. Now you can see Live on blog, Click EDIT HTML Button"

4. Now click Proceed button.
   
5. Find this tag by using Ctrl+F    ]]></b:skin>

6. Paste below code Before ]]></b:skin> tag

/* The CSS Code for the menu starts here bloggertrix.com */

div#socialbox, div#socialbox ul, div#socialbox ul li, div#socialbox ul li p, div#socialbox ul li p img, div#socialbox ul li p span, #socialbox ul li p a{
background: none;border: none;margin: 0;padding: 0;}

div#socialbox{
color: #768a96;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
width:300px;}

div#socialbox ul{
background: url() repeat;
border: 1px solid #d8dcdf !important;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: 0px 2px 4px #dfe4e7;
-moz-box-shadow: 0px 2px 4px #dfe4e7;
box-shadow: 0px 2px 4px #dfe4e7;
list-style: none;
margin: 0 !important;
padding: 0;}
    
div#socialbox ul li{
background-image: none;
border-bottom: 1px solid #d8dcdf;
height: 59px;
list-style: none;}
    
div#socialbox ul li:last-child{
border-bottom: none;}
        
div#socialbox ul li p{
padding: 19px 9px 0 9px;}
        
div#socialbox ul li p img{
border: none;
margin-right: 10px;
position: relative;
top: 3px;
vertical-align: baseline;}
            
div#socialbox ul li p span{
color: #425763;
font-weight: bold;}
                
div#socialbox ul li p a.socialbox-button{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhg9_WscsLoqlUC9wnX0Dh_t47-bDBItWt66Ugg9hnymQDGSiHbuZFluCaeGeiUxQ-EK4MzrkO1Xw8YH32WIazrV4g0GDXA0wxuSVzvXHiYFM-j2gXcPaEetfR0XuYiLpsSBDNKv_av2Ng/s1600/bloggertrix-button.png) no-repeat;
border: 1px solid #d8dcdf;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
color: #425763;
float: right;
font-size: 11px;
font-weight: bold;
line-height: 11px;
padding: 6px 10px;
position: relative;
text-decoration: none;
text-transform: uppercase;
top: -2px;}
                
div#socialbox ul li p a.socialbox-button:hover{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhg9_WscsLoqlUC9wnX0Dh_t47-bDBItWt66Ugg9hnymQDGSiHbuZFluCaeGeiUxQ-EK4MzrkO1Xw8YH32WIazrV4g0GDXA0wxuSVzvXHiYFM-j2gXcPaEetfR0XuYiLpsSBDNKv_av2Ng/s1600/bloggertrix-button.png) 0 -27px no-repeat;}
                
div#socialbox ul li p a.socialbox-button:active{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhg9_WscsLoqlUC9wnX0Dh_t47-bDBItWt66Ugg9hnymQDGSiHbuZFluCaeGeiUxQ-EK4MzrkO1Xw8YH32WIazrV4g0GDXA0wxuSVzvXHiYFM-j2gXcPaEetfR0XuYiLpsSBDNKv_av2Ng/s1600/bloggertrix-button.png) 0 -54px no-repeat;}

7. Go to blogger and click Layout

8. Click Add Gadget and select 'HTML/Javascript

9. Paste below code.

<br />
<div id="socialbox">
<ul>
<li><p>
<a href="http://www.facebook.com/antisite2" target="_blank" title="Like on Facebook"><img alt="Facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfUVxnyF4Qo_mOUPAeXZ-do4fZ9sbT55U5gmk1oqyPLIDgzKIto6PNQv_Z-06QBDMxiRt7lNmwnZDz_ElhuubXL3WsqZgx08ZymiV_-ud6Gkz7xDaDFimAhtfGXQe6k6LdgEMOG59NtZk/s1600/bloggertrix-facebook.png" /></a>2,482 Fans                                    
<a class="socialbox-button" href="http://www.facebook.com/antisite2" target="_blank" title="Like on Facebook">Like</a></p>
<br /></li>

<li><p><a href="http://twitter.com/antisite2" target="_blank" title="Follow on Twitter"><img alt="Twitter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHfE1tTcpGI-j-_7oK3Q7Id1XMtbByOuXIp6ZC16B4YBn01mITLIXAQJI-JxtvQDJXylzG_Kklka4UraO4NYxmtpv7IZN9twPvlqbKEL0iKhmFiumgSEgtW-CxaXGniAJARBHrnxUh7PE/s1600/bloggertrix-twitter.png" /></a>5,365 Followers                                    
<a class="socialbox-button" href="http://twitter.com/antisite2" target="_blank" title="Follow on Twitter">Follow</a>
<br /></p></li>

<li><p><a href="http://feeds.feedburner.com/antisite2" target="_blank" title="Subscribe to Feed"><img alt="Feedburner" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaFJeMfHuM2YcFp1sgJUFQ1QFTdPb9MMraVCFUoxeLTioiiqx698Xx87Epbmhi9rcRxqJUe2MFMKReOYrtiUT9k5ubQTmA-lNq1i__oXVc9_hB1V-cAXUKDEXbP0z9wzcfRQZJlQlv3Cc/s1600/bloggertrix-feedburner.png" /></a>1,094 Subscribers                                    
<a class="socialbox-button" href="http://feeds.feedburner.com/antisite2" target="_blank" title="Subscribe to Feed">Subscribe</a>
<br /></p></li>
</ul>
</div>

Replace antisite2 with your usernames.

10. Now save your HTML/Javascript'.

Related Blogger Tips

• How To Add Pop Up Email Subscription Form For Blogger Using Jquery
• How To Add One Time Popup Email Subscription Widget For Blogger
• New Comments Page Navigation Widget for Blogger / Blogspot
• Cool Floating Recent Tweets Widget for Blogs
• How to add Unique Style Social Sharing Box For Blogger
• Top 5 Ways To Create Conversions with Hangouts On Air
• 7 Reasons Why You CAN’T Make Money Blogging
• Blogger Tip: Importing Your Blog
• Increase Traffic By Solving Problems
• How to Build a Cloud Computing Network
• How to Increase your blogger followers
• How To Write Your Most Popular Blog Post
• Five Tips to Write a Successful Blog Post
• What is Blog
• Awesome CSS3 Image Circle Hover Effect For Blogger
• 3 reasons why many bloggers get frustrated and what to do against it
• Changing Title Meta Tag can hurt Google Rankings
• How to add Description and Keyword metatags to Blogger blogs?
• Add Facebook Recommendations Bar To Blogger
• Best practices to help Google find, crawl, and index your site