Friday, 26 November 2010

Drop Down Subscription Box or Widget

Everybody knows the imprtance of Rss feeds.So its better to give the readers an option to subscribe to your feeds in their favourite Rss Reader..

Here in this blog you can see a Drop Down Subscription box on the left.Here is how i implemented it..

Goto your Blogger Template>Edit Html and find 


body {

and place the following code just above it..

/* http://www.bloggerplugins.org--- Dropdown Subscription Box
*/
.img0 { width: 83px; height: 17px; margin-left : 1.5em;margin-bottom : .6em;background: url("http://simpletricksblog.googlepages.com/rss.jpg"); cursor:hand;cursor:pointer;}
.img1 { width: 83px; height: 17px; margin-left : 1.5em;margin-bottom : .6em; background: url("http://simpletricksblog.googlepages.com/addgoogle.gif"); cursor:hand;cursor:pointer;}
.img2 { width: 83px; height: 17px; margin-left : 1.5em;margin-bottom : .6em; background: url("http://us.i1.yimg.com/us.yimg.com/i/us/my/addtomyyahoo4.gif"); cursor:hand;cursor:pointer;}
.img3 { width: 83px; height: 17px; margin-left : 1.5em;margin-bottom : .6em; background: url("http://www.netvibes.com/img/add2netvibes.gif "); }
.img4 { width: 83px; height: 17px; margin-left : 1.5em;margin-bottom : .6em; background: url("http://simpletricksblog.googlepages.com/rss-bloglines.gif "); cursor:hand;cursor:pointer;}
.img5 { width: 83px; height: 17px; margin-left : 1.5em;margin-bottom : .6em; background: url("http://www.newsgator.com/images/ngsub1.gif ");cursor:hand;cursor:pointer; }
.img6 { width: 83px; height: 17px; margin-left : 1.5em;margin-bottom : .6em; background: url("http://simpletricksblog.googlepages.com/addmymsn.gif ");cursor:hand;cursor:pointer; }
.img7 { width: 83px; height: 17px; margin-left : 1.5em;margin-bottom : .6em; background: url("http://simpletricksblog.googlepages.com/addrojo.gif "); cursor:hand;cursor:pointer;}
.img8 { width: 83px; height: 17px; margin-left : 1.5em;margin-bottom : .6em; background: url("http://simpletricksblog.googlepages.com/addmyaol.gif "); cursor:hand;cursor:pointer;}
.img9 { width: 83px; height: 17px; margin-left : 1.5em;margin-bottom : .6em; background: url("http://simpletricksblog.googlepages.com/addfeedlounge.gif "); cursor:hand;cursor:pointer;}
.img10 { width: 83px; height: 17px; margin-left : 1.5em;margin-bottom : .6em; background: url("http://simpletricksblog.googlepages.com/addnewsburst.gif ");cursor:hand;cursor:pointer; }
/* End Simple Tricks Coding */


(it not necessary to put it exactly above body { but i mentioned it to avoid confusion.)

Now add the following widget to your blog.(The widget will work only if you have done the template edit mentioned above)


Note: If you are reading this in a Feed Reader the widget installer wont be displayed.So visit the actual article on the site to install the widget.

No comments:

Post a Comment