Social Media Profile With Rss Subscription Widget For Blogger

In this tutorial im gonna  explain  how  to  add unique Rss Subscription   widget  with  social   media   profile   icons. This is also  unique  widget designed  by  bloggertrix.com By   using  this  widget  you  can  link  your  social  media profile  Facebook, Twitter  and  Rss   and   subscribe field.

It will help to  get  the  new  updates by  emails. im added for it.You can check it from below   demo link.If you want to look at other rss feed subscription widget,click this link.

Demo

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

2. Now select "Layout" Like Below.

3. Click Add Gadget and select 'HTML/Javascript

4. Paste below one of below code.

<style>
#btrixsocialcounters{
width:300px;
padding: 0 0 40px 0;
border: 1px solid #CCC;}
ul#btrixcounters {
    list-style: none;
    margin:0px;
    overflow: hidden;
    width:300px;
    padding:10px 0 40px 0;
     margin:10px 0 -60px 12px;
}
ul#btrixcounters li {
    float:left;
    margin:0px 0px 5px 0px;
    width:auto;
    padding:0px;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;}

ul#btrixcounters li a {
    display: block;
    height: 54px;
    margin-right: 10px;
    padding-top: 85px;
    text-align: center;
    text-decoration: none;
    width: 85px;
    text-shadow: 1px 1px 0 rgba(255,255,255,0.5);
    font-weight: bold;
}
ul#btrixcounters li:hover {
    opacity:0.6
}
ul#btrixcounters li:last-child a{
    margin-right:0px;
}
ul#btrixcounters #counter-rss {
    background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqG8fxhdcNOZ9-ifMr2WQrKUnGwS6cLsiY1Dy6UjMgfe82sG8hciP_ZXPb3BNTs50iVSMkVBj3ysrv8CXnKmsMP8uH0YM3-03opOV5pREIQzMvMh8UNat8iQ-gF_XfhVYh6B3jVHdpbr94/s1600/btrix-rss-counter.jpg') no-repeat
}
ul#btrixcounters #counter-rss a {
    color:#cf6600
}
ul#btrixcounters #counter-facebook {
    background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKShGMKJdufZuVOuLSl-8Wp_f9n9iZ4kpaSa5TnnilF_40WgIyugUp2uCC813ZUMbzGSEdbOjT2P3pjDeQ19X0ekoODgpzAG9XxtWZDDbihiBWOwaDHEr7nBZjymdD4ecJJkAq5RXBRvy_/s1600/btrix-facebook-counter.jpg') no-repeat
}
ul#counters #counter-facebook a {
    color:#3b4d8f
}
ul#btrixcounters #counter-twitter {
    background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsV8XpNJ_heg0L9hfh0MgpQNpuUaYD9TuzZsQp30eHo-O19Oa0THhiPgFWaZBC6f6Tk_qOAffrd8RaMcrhdlHX9VSEPmUT5y8CMatdHeppHGkGbVsDxH2GS25yRdr3OWIzDmKpekUd_1iI/s1600/btrix-twitter-counter.jpg') no-repeat
}
ul#btrixcounters #counter-twitter a {
    color:#276ab6
}
.textwidget {width: 300px;margin-top: -50px;}

input[type="submit"] {color: white;border: 0px;text-transform: uppercase;font-size: 11px;padding: 13px;float: left;font-weight: bold;background-color: #2DA1EB;margin-left: 100px;cursor: pointer;margin-top: 10px;}
</style>
<center>
<br />
<div id="btrixsocialcounters">
<ul id="btrixcounters">
<li class="first-item" id="counter-rss">
<a href="http://feeds.feedburner.com/bloggertrix">540</a></li>
<li id="counter-facebook">
<a href="http://www.facebook.com/bloggertrix">2319</a></li>
<li id="counter-twitter">
<a href="https://twitter.com/#!/bloggertrix">5263</a></li>
</ul>
<div class="btrixtextwidget">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix', 'popupwindow', 'scrollbars=yes,width=350,height=520');return true" style=" padding: 3px; text-align: center;" target="popupwindow">
<h3>Enter your email address:</h3><br />
<input name="email" style="width: 180px;" type="text" /><br />
<input name="uri" type="hidden" value="bloggertrix" /><input name="loc" type="hidden" value="en_US" /><input type="submit" value="Subscribe" /></form></div><a href="http://www.bloggertrix.com/2013/03/social-media-profile-with-rss.html" style="margin-right: -50px;margin-top: 100px;font-size: 10px;">Add this</a>
</div>

You have to change the counters manually, just change red color number according to profile.

Replace bloggertrix with your Feedburner ID
Replace bloggertrix with your Facebook username
Replace bloggertrix with your Twitter Username

5. Now save your HTML/Javascript'.

    You are done...