In this tutorial i'm going to explain how to add Black or Dark Style Rss Feed
Widget With social media network share buttons this widget have social media
profile Facebook,Twitter,Rss,Google Plus,Pinterest and subscribe your blog or
website.it is very easy to add to your website,just follow the steps mentioned
below.
1. Log in to blogger account.
2. Now select "Layout"
3. Click Add Gadget and select 'HTML/Javascript
4. Paste below code
<style>
#bs-newsletter{ width:290px;background:#2e3639; color:#fff; padding:20px; font-size:14px; margin-bottom:20px; -moz-box-shadow: 2px 2px 2px #000000;-webkit-box-shadow: 5px 5px 5px #000000;box-shadow: 5px 5px 5px #000000;border:double 5px #000000;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright:5px;
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-bottom-right-radius:5px;
border-top-left-radius:5px;border-top-right-radius:5px;border-bottom-left-radius:5px;border-bottom-right-radius:5px;}
#bs-newsletter .bs-title { margin-bottom:10px;margin-top:-10px; }
.bs-title{margin-left: 8px;font-size:25px; font-weight:bold; border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;padding:1px 8px 2px 8px;text-align:center;border:1px solid #151819;color:#fff;background:#222729;display:inline-block;}
#footer-subscribe-btn {width:116px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;
position:relative;left:135px;}
.footer-submit-btn {margin-left:50px;margin-top:-5px;margin-bottom:-50px;border: none;color: #fff;text-transform: uppercase; font-size: 13px;padding: 5px 18px 5px;background: #e93a30;border-radius: 30px;-webkit-border-radius: 30px;
-moz-border-radius: 30px;font-weight: bold;-webkit-transition: background .2s linear;
-moz-transition: background .2s linear;-ms-transition: background .2s linear;-o-transition: background .2s linear;transition: background .2s linear;cursor: pointer;
}
.footer-submit-btn:hover { background:#e51111;}
#fastsearch ,#footer-subscribe-email{background:#62686b;color:#fff;font-size:14px;border:none;
box-sizing:border-box;border-radius:30px;-webkit-border-radius:30px;-moz-border-radius:30px;outline:none;padding:0px 15px; height:30px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
#fastsearch.inactive ,
#footer-subscribe-email.inactive {color:#b5b7b8;}
#footer-subscribe-email {width:100%;}
#sb-nl-members-count { font-size:12px; font-weight:bold;text-align:center;width:150px;margin:0 0 -36px 0 ;display:inline-block;
</style>
<br />
<div id="bs-newsletter">
<div class="bs-title">
Get Email Updates</div>
<div class="btrix-nl-text">
<center>
Subscribe to Get Latest Updates Free</center>
</div>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggersstand', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input class="inactive footer-text-field" id="footer-subscribe-email" name="EMAIL" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" type="text" value="Your email address" />
<input name="uri" type="hidden" value="bloggersstand" />
<input name="loc" type="hidden" value="en_US" />
<br />
<div id="sb-nl-members-count">
<table border="0">
<tbody>
<tr>
<td style="padding-right: 4px;"><a href="http://twitter.com/bloggersstand" target="_blank" title="Follow Me On Twitter">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibW7FoOVa5xXj0bFNPlPEbPxrVl5fx3tbs00W660Uwk2Ti6Kf9JrXR5gQetfP0Zeo1swJxiwQJVngFXZSrv5yJPTfTUtS1a9J0RBbF4QoaEPBJIP2xbYjiig9xdB8mxf9JIs0kMpngqFs/s1600/bloggertrix.com-twitter-icon.png" style="height: 25px; width: 25px;" /></a>
</td>
<td style="padding-right: 4px;"><a href="http://feeds.feedburner.com/bloggersstand" target="_blank" title="Subscribe Via RSS">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgctVqQLxvoMuELogzPG9J8-j2Czz4Ma5-HGmL0AweDyRYq9M5mn1PPqm9WiigWXdgqU9DOHbeLCSHb7UHqhBxem9pPQJ0NFwbMEXbSGLisweO81_34BrzWwdUZimyUsTKrslyklv5meXk/s1600/bloggertrix.com-rss-icon.png" style="height: 25px; width: 25px;" /></a>
</td>
<td style="padding-right: 4px;"><a href="http://www.facebook.com/bloggersstand" target="_blank" title="Find Us On Facebook">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8nc1a7zZrFaAkd5Y6M0FTYL_Ts5B6EkuRLE87IbrdAANlZQuBkm4sM_jrmkFv5rgRYF2E-0HVPRCgQG34c4yZ0jmBEhOwKm77IpR3zGtt-R6NjsMduxxqsOcwxxgD1IflNZbo9a1ZTpo/s1600/bloggertrix.com-facebook-icon.png" style="height: 25px; width: 25px;" /></a>
</td>
<td style="padding-right: 4px;"><a href="https://plus.google.com/115587840274121878323" target="_blank" title="Add me on Google+">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtwDiNnNcR4bI-wUgmC_2DkDhe3nNg79EBx0bcWNO7Efw-WWFv6SmCtpsZzuCdF6Xt5ekRgNb7VGFPj0dIMk9Dl4PnAbr_JRCdBKmTstMI50nkB7JEf03TYlijJh0y7Bkov5VNfp3XwTA/s1600/bloggertrix.com-google-icon.png" style="height: 25px; width: 25px;" /></a>
</td>
<td style="padding-right: 4px;"><a href="http://youtube.com/Userid" target="_blank" title="youtubr subscribe">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9H3RMZRY0vxhf4kZJFZFbVPmJY4TiCQDiidCyhCzInWNa_tkOn3AKK4Skj6c3MSvXdn_LkbFS8U7fxlY0ojHUiSHyRpdBE6uFWcM1ZkOlNVw7s9EWmudlUDPLgOn0s2KrLELv3BjoD6M/s1600/bloggertrix.com-youtube-icon.png" style="height: 25px; width: 25px;" /></a>
</td></tr>
</tbody></table>
</div>
<input class="footer-submit-btn" id="footer-subscribe-btn" type="submit" value="Subscribe" />
<div class="clr">
</div>
</form>
</div>
- Change bloggersstand with your Facebook username.
- Change bloggersstand with your Twitter Username.
- Change bloggersstand with your Feed Username
- Change Userid with your Youtube Username.
- Change 115587840274121878323 with your Google plus id
5. Now save your 'HTML/Javascript'.. Done !