Way2blogging style social subscription widget for blogger

Way2blogging.org is one of my favorite blog and i love template of that blog.Harish is really expert you may see this social subscription widget in way2blogging.org old template.So today I wil teach you how to add this good looking social subscription widget for blogger.

To add this beautiful widget to your blog follow some quick steps-

• Go to blogger dashboard.
• Now click on layout tab.
• Now Add html/Javascript
• Paste below code there and save it.

<style>
@import url("http://fonts.googleapis.com/css?family=Oswald&text=AaBbCcEeFfIiKkLlMmOoRrSsTtWw%20");
.w2bOldSocial ul {
font-family: 'Oswald', sans-serif;
margin: 15px 0;
overflow: hidden;
}
.w2bOldSocial ul li {
float: left;
width: 90px;
padding-left: 55px;
margin: 0 0 0 5px !important;
line-height: 48px !important;
}
.w2bOldSocial ul li a {
font-size: 20px !important;
text-decoration:none;
}
.w2bOldSocial ul li a:hover {
text-decoration:underline;
}
.w2bOldSocial ul li.w2brss {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj80shAvqWXk5C7Gyhe8OEFEUMQfSsQCdO-lIAKVogH77UBUF_tzcK60N2ULhNjjrEswkcM66KHhHMoqeKRIANfpulHBU2NmfOQbUhTbedA5-Rv5NNBhInR_BsS3GJelBwvAzgVAUWFvYD8/s48/RSS.png") no-repeat scroll left center transparent;
}
.w2bOldSocial ul li.w2bmail {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilJjbaacP9p57vc1owpmeknPGHJlPFnT5qrg51oktV457u6P6JhGcrzmAZxlwlwpxdYChIVi2eCYyROBewwLfnTCTrvzKFTsHg1QNhVZKdgx-7j-zE4aDIQDVTQx9mOxP8Us6EY6zBTUuO/s48/Mail.png") no-repeat scroll left center transparent;
}
.w2bOldSocial ul li.w2btwitter {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcF4PLh8GgrqhRdJDcLqmu34qnh_nfGMyRhGPpotFmMWtOvIie0BSq0pvwQgHThp0ltyaZSq55EB4Je01Bnwp63depWMy7CV8shEl6DAyisUjZay-26vGeOw_JH1Qt-WsGzQFrAtw3RAET/s48/Twitter2.png") no-repeat scroll left center transparent;
}
.w2bOldSocial ul li.w2bfacebook {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizYpeaPHUrxfhq0ucSZ1cH2un0Dmb1ZHCzAz41I4k6kgE8Zithucc-jjcPprfzB5m9SLVwiInIdyRnU5OYE_-K4hLw8Anjwf1xx2ewp8m-I2yM1Ay2TGzBaXYjI6ynC-Fd0Qpxh_ZJgc1F/s48/Facebook.png") no-repeat scroll left center transparent;
}
#w2bEmailsub {
display: block;
clear: both;
margin: 10px 0;
}
form.w2bEmailform {
margin: 20px 0 0;
display: block;
clear: both;
}
.emailText {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuTzIKP4Ba92NwXWVxjraK6tRbpCZ7oUt4sRwvsmdR2FkExDtGKjbuwTeZLJMp_Eo1-cj2hUWBX0xI42bYYNEuLlMmq-EMvONFb6WcaRpLxuEkV5YnykzWjYyydUxQmmQC1wh_ePFPUKFy/s28/w2b-mail.png") no-repeat scroll 4px center transparent;
padding: 7px 15px 7px 35px;
color: #444;
font-weight: bold;
text-decoration: none;
border: 1px solid #D3D3D3;

-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;

-webkit-box-shadow: 1px 1px 2px #CCC inset;
-moz-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
}
.emailButton {
color: #444;
font-weight: bold;
text-decoration: none;
padding: 6px 15px;
border: 1px solid #D3D3D3;
cursor: pointer;

-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;

background: #fbfbfb;
background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FBFBFB', endColorstr='#F4F4F4',GradientType=0 );
background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
}
</style>
<div class="w2bOldSocial">
<ul>
<li class="w2brss"><a href="http://feeds.feedburner.com/lordhtml">RSS</a></li>
<li class="w2bmail"><a href="http://feedburner.google.com/fb/a/mailverify?uri=lordhtml" >Email</a></li>
<li class="w2btwitter"><a href="http://twitter.com/lordhtml">Twitter</a></li>
<li class="w2bfacebook"><a href="http://facebook.com/lordhtml">Facebook</a></li>
</ul>
</div>
<div id="w2bEmailsub">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=lordhtml', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" class="w2bEmailform">
<input type="hidden" value="lordhtml" name="uri" />
<input type="hidden" name="loc" value="en_US" />
<input type="text" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" value="Enter your email..." name="email" class="emailText" />
<input type="submit" class="emailButton" value="SignUp" title='' />
</form>
</div>

Customization:-

• http://feeds.feedburner.com/lordhtml with your feedburner url
• http://feedburner.google.com/fb/a/mailverify?uri=lordhtml change the Feedburner ID
• http://twitter.com/lordhtml with your Twitter URL
• http://facebook.com/lordhtml  with your Facebook Page URL
• <input type="hidden" value="lordhtml" name="uri" /> change the Feedburner ID with yours.