20 Ways To Make $5000+ From Home. Earn Now!

Table of Content

Beautiful Rss Subscription Feed Box Widget

Beautiful Rss Subscription Feed Box Widget for blogger,rss feed subscriber gadget with html and css use,email subscription widget for blogspot blogger website
Beautiful Rss Subscription Feed Box Widget
In this tutorial i'm going to explain how to add Rss Feed Subscription Widget for your blogger website or blog.



DEMO



1. Log in to blogger account
2. Now select "Layout"
3. Click Add Gadget and select 'HTML/Javascript'
4. Paste below code
<style>
.bordered {
    border: solid #ff7417 2px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 1px 1px #ccc;
    -moz-box-shadow: 0 1px 1px #ccc;
    box-shadow: 0 1px 1px #ccc;      
}
.bordered2 {
height: 25px;
    background-color: #ff7417;
    -webkit-border-top-left-radius: 6px;
    -khtml-border-radius-topleft: 6px;
    -moz-border-radius-topleft: 6px;
     border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -khtml-border-radius-topright: 6px;
    -moz-border-radius-topright: 6px;
     border-top-right-radius: 6px;    
     text-shadow: 0 1px 0 rgba(255,255,255,.5);
     border-top: solid #ffffff 1px;
}
</style>
<div class="bordered">
<div class="bordered2">
<center>
<span style="color: #ffffff; font-size: 16px;"><b>Subscribe Now</b></span></center></div>
<a href="http://feeds2.feedburner.com/bloggersstand" rel="alternate" title="Subscribe now to avail the unthinkable" type="application/rss+xml"><img border="0" alt="" style=" padding-bottom:20px; margin: 0pt 10px 10px 0pt; float: left; width:100px; height:100px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJBJ0YZoo-GBG1VmS2Ax6ti8nQLhfKD600k-MuXy9bjRrywGZjQqAmoIhuG0BnqaiRGXhgPdtAXjG3vKv1cC5zgldQY97eV5P7ZRJk_iEtmFGxcDX0KsLSVUcI6liZRMPTvzLTYHUrURM/s1600/RSS-Reader-Book-icon.png"/></a><p><a href="http://feeds2.feedburner.com/bloggersstand" rel="alternate" title="Subscribe to my feed" type="application/rss+xml">Get free email updates </a><span style="color: #ffffff; font-weight: bold;">By submitting your email address here</span></p>
<style>
input.bt {
color:#fff;
font: bold 10px Arial, sans-serif;
background:#F39100;
border:0;
padding:3px;
}
input.bthov {
color:#fff;
font: bold 10px Arial, sans-serif;
border:2px solid #F39100;
padding:3px;
}
</style>
<form action="http://feedburner.google.com/fb/a/mailverify" style="padding: 5px; " target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggersstand', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input style=" color:#ffffff; background: #fff; border:1px solid #ff7417; width: 90px;" name="email" type="text"/>
<input value="bloggersstand" name="uri" type="hidden"/><input value="en_US" name="loc" type="hidden"/> <input onmouseover="this.className='bt bthov'" onmouseout="this.className='bt'" value="GO!" class="bt" type="submit"/></form><br/>
</div>

  •  Change bloggersstand with your Feed username.

5. Now save your 'HTML/Javascript'.. Done !

Post a Comment