Feedburner Chicklet with an attractive Subscribe Button

6:16 AM Posted by Hammad Ansari

Displaying Feedburner chicklet on your blog is one way to get the concentration of your new readers and to enforce them to subscribe. The classic chicklets from feedburner aren't that appealing and secondly it seems bizarre when you've got a 300px wide sidebar and your place the 88px wide chicklet within that (however placing it in any other area it might look fine but trust me this one is awesome :D). I made the Feedburner Chicklet widget with a subscribe button which would definitely fit in your sidebars plus its awesome. I've kept the installation process very short and simple.

Feedburner Chicklet Widget's Installation Process!

Follow the steps below exactly as mentioned.

Go to Blogger >> Design.
Add a Gadget.
Select HTML/Javascript and paste the code below within that.

<style>
.rssbuttontable
{
border: 1px solid #E6E6E6;
background: #FFDCB1;
float: center;
width: 265px;
margin:0px 0 0 0px;
padding: 5px 5px 5px 5px;
border-radius: 5px;
-moz-border-radius: 5px;
height: 35px;
float: left;
display: inline;
}
input.Subscriberssbutton
{
background:-moz-linear-gradient(top,#F88017 0%,#FF6600 100%); background:-webkit-gradient(linear,left top,left bottom,from(#F88017),to(#FF6600)); 
border: 1px solid #FF6600; 
text-transform: none; 
font:bold 13px arial;
 color: #fff; 
height: 30px;
 padding: 2px 2px 5px 2px;
 margin: 0px 0 0x 0px;
 border-radius: 5px; 
-moz-border-radius: 5px;
 -webkit-border-radius: 5px;
 cursor:pointer;
display: inline;
}
</style>
<table class="rssbuttontable"><tr><td><a rel="nofollow" href="http://feeds.feedburner.com/BloggerTat"><img src="http://feeds.feedburner.com/~fc/BloggerTat?bg=FF6600&amp;fg=444444&amp;anim=1" height="26" width="88" style="border:0" alt="" /></a></td><td><input value="Subscribe to Get Updates" class="Subscriberssbutton" type="button" onclick="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=BloggerTat', 'popupwindow', 'scrollbars=yes,width=650,height=570');return true"></td></tr></table>

5. You need to Replace BloggerTat (from the code above) with your feedburner id. It appears 3 times, change 'em all.
6. Click save. That's it you are done :).

Customization

The widget looks pretty cool with those color schemes but still if you need to alter its looks, you can do that.
To change the background of the Widget replace background: #FFDCB1; with your value.
To change the color of the chicklet, replace bg=FF6600 with your own value.
If you wanna completely remove the background, simply remove the code below from the main code.
border: 1px solid #E6E6E6;
background: #FFDCB1;

ENJOY!!!!

Tags: Feedburner, Subscribe, Widgets

Share your views...

0 Respones to "Feedburner Chicklet with an attractive Subscribe Button"

Blogger TAT

Popular Posts