How To Add Social Subscription in Blogger Blog

In this article I’m going to share social subscription widget This social subscription will enable users to like/follow you on the social networks such as Facebook, Twitter, Google+ and subscribe your feeds using the built-in feed burner email subscription widget. Social networks are playing a vital role in blogging these days. The count of followers, fans and subscribers shows the popularity of your blog/website. They also allow you to connect with your online readers and share your content with them. You can see the preview of this social subscription widget in the screenshot given below. Later in this article I am going to tell you how you can add this widget to your blog. to add this widget follow these step 

• Log in you account 
• Click on the template
• Click on the Edit HTML
• Now Find the </head>
• Press CTR+F to find </head> and past the below code above </head>
• Save the template 

<script type=”text/javascript”>
(function() {
var po = document.createElement(‘script’); po.type = ‘text/javascript’; po.async = true;
po.src = ‘https://apis.google.com/js/plusone.js’;
var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(po, s);
})();
</script>

1.Now go back
2.click on the layout
3.click on the add widget
4.select HTML/JAVASCRIPT
5. copy the below code and past 

<style type=”text/css”>
/* RB Style sheet for subscription box */
#rb-subscribe-box .fb-like-box { border: 1px solid #EBEBEB; padding: 5px; background:#fff;}
#rb-subscribe-box .gplusone { background: #f7fcfc; border: 1px solid #EBEBEB; border-top: 1px solid #fff; color: #000; font-size: 10px; line-height: 1px; padding:5px;}
#rb-subscribe-box .twitter-follow { background: #eef9f9; border: 1px solid #dff6f6; border-top: 1px solid #fff; padding:5px 11px;}
#rb-subscribe-box .email-box {background:#e3edf4; padding:11px;}
#rb-subscribe-box .email-box h4{color: #555;font-family: Arial;font-size: 12px; margin: 0 0 10px;}
#rb-subscribe-box .email-box .txt,#rb-subscribe-box .email-box .txt:focus{background:#fff; float:left; color:#92c3c3; border:1px solid #E36B0A; border-radius: 3px; padding: 7px 10px 8px; width: 150px;}
#rb-subscribe-box .email-box .btn,#rb-subscribe-box .email-box .btn:focus{background:#E36B0A; border:1px solid #AD5513; color:#fff; border-radius: 3px; float: right; font-size: 12px; font-weight: bold; padding: 7px 8px; text-shadow: 1px 1px 0 #D08D00;}
#rb-subscribe-box .email-box .btn:hover{background:#FF9b00;}
input, textarea {
font-family: Georgia, “Times New Roman”, Times; font-size: 1em;}

#rb-text {

border: 4px solid #C8e993;
box-shadow: 0 0 5px
#EEE;
line-height: 10px;
margin: 10px 10px 15px 0;
padding: 10px;
width:300px;
}
#rb-text h3 {
color:white;
border-bottom: 1px dotted
white;
line-height:1.385em;
font-size: 18px;
padding: 0;
margin: 0 0 10px;
border-bottom: 1px dotted
#AAA;
font-wieght: bold;
text-transform: uppercase;
letter-spacing: 0;
}
</style>
<div class=”rb_widget”>
<div id=”rb-text”>
<div id=”rb-subscribe-box”>
<div class=”email-box”>
<h4>Subscribe FREE updates on your <a href=”http://feedburner.google.com/fb/a/mailverify?uri=nafisflahi” target=”_blank”>Email</a> | <a href=”http://feeds.feedburner.com/nafisflahi” target=”_blank”>RSS</a></h4>
<form onsubmit=”window.open(‘http://feedburner.google.com/fb/a/mailverify?uri=nafisflahi’, ‘popupwindow’,
‘scrollbars=yes,width=700px,height=700px’);return true” target=”popupwindow” method=”post” action=”http://feedburner.google.com/fb/a/mailverify”>
<input name=”email” onblur=”if (this.value == ”) {this.value = ‘Enter your email address’;}” onfocus=”if (this.value == ‘Enter your email address’)
{this.value = ”;}” value=”Enter your email address” class=”txt” />
<input type=”hidden” name=”uri” value=”nafisflahi” />
<input type=”hidden” value=”en_US” name=”loc” />
<input type=”submit” value=”Subscribe” class=”btn” />
<div style=”clear:both;”></div>
</form>
</div>

<div class=”fb-like-box”>
<iframe src=”//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2Falltypsms&send=false&layout=button_count&width=450&show_faces=false&font&colorscheme=light&action=like&height=21″ scrolling=”no” frameborder=”0″ style=”border:none; overflow:hidden; width:450px; height:21px;” allowtransparency=”true”></iframe><a href=”http://www.facebook.com/alltypsms” target=”_blank” rel=”nofollow” style=”color: #3B5998; font-family: arial; font-size: 13px; font-weight: bold; line-height: 20px;”> Like us on Facebook </a><div class=”clear”></div>
</div>
<div class=”gplusone”>
<div style=”float:left;width:90px;”>
<g:plusone href=”http://www.nafisflahi.blogspot.com”></g:plusone>
</div>
<a href=”https://plus.google.com/103785803956457565128″ target=”_blank” rel=”nofollow” style=”color: #d00; font-family: arial; font-size: 13px; font-weight: bold; line-height: 24px;”>Circle us on Google+</a><div class=”clear”></div>
</div>
<div class=”twitter-follow”>
<a href=”https://twitter.com/nafis922″ class=”twitter-follow-button”>Follow @how to do </a>
<script src=”//platform.twitter.com/widgets.js” type=”text/javascript”></script></div> <br/>
<div >

</div>
</div>
</div></div>

• Now replace the nafisflahi  with your feed burner name 
•  Replace the lltypsms with your Facebook page name 
• Replace the  http://www.nafisflahi.blogspot.com with your website or blog address
• Replace the 103785803956457565128 with your Google plus id
• Replace the nafis922 with your Twitter name 

Now Save it you are done