How To Add Technorati Rank Widget for Blogger

1.First login to your Technorati Account.

2.Now click here to get your Technorati API Key.



3.Login to blogger dashboard-->Layout-->Page Elements

4.Click on 'Add a Gadget' .

5.Select 'HTML/Javascript' and add below code and click save.

<div style="background-image:url(http://simpletricksblog.googlepages.com/technoratirank.gif);background-repeat:no-repeat;height:26px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font size="1"><script type="text/javascript"> function addCommas(nStr) { nStr += ''; x = nStr.split('.'); x1 = x[0]; x2 = x.length > 1 ? '.' + x[1] : ''; var rgx = /(\d+)(\d{3})/; while (rgx.test(x1)) { x1 = x1.replace(rgx, '$1' + ',' + '$2'); } return x1 + x2; } function pipeCallback(obj) { document.write(addCommas(obj.value.items[0].title)); } </script> <script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=0d02a870cc849bf82a56166abd0b7671&url=http%3A%2F%2FYOURBLOG.blogspot.com&num=10&api_key=YOUR-TECHNORATI-API-KEY" type="text/javascript"></script> </font></div><br/><a href="http://technorati.com/faves?sub=addfavbtn&amp;add=http://YOURBLOG.blogspot.com"><img border="0" alt="Add to Technorati Favorites" src="http://static.technorati.com/pix/fave/tech-fav-1.png"/></a><br/><br/><span style="font-size: 80%">Widget by <a href="http://www.bloggerplugins.org">Blogger Widgets </a></span>

Note : Remember to replace YOURBLOG and YOUR-TECHNORATI-API-KEY with your real informations.Look at the example below.

<div style="background-image:url(http://simpletricksblog.googlepages.com/technoratirank.gif);background-repeat:no-repeat;height:26px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font size="1"><script type="text/javascript"> function addCommas(nStr) { nStr += ''; x = nStr.split('.'); x1 = x[0]; x2 = x.length > 1 ? '.' + x[1] : ''; var rgx = /(\d+)(\d{3})/; while (rgx.test(x1)) { x1 = x1.replace(rgx, '$1' + ',' + '$2'); } return x1 + x2; } function pipeCallback(obj) { document.write(addCommas(obj.value.items[0].title)); } </script> <script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=0d02a870cc849bf82a56166abd0b7671&url=http%3A%2F%2Fbloggertipandtrick.blogspot.com&num=10&api_key=d727c3e16f6f03d2f15dec0c8806860c" type="text/javascript"></script> </font></div><br/><a href="http://technorati.com/faves?sub=addfavbtn&amp;add=http://bloggertipandtrick.blogspot.com"><img border="0" alt="Add to Technorati Favorites" src="http://static.technorati.com/pix/fave/tech-fav-1.png"/></a><br/><br/><span style="font-size: 80%">Widget by <a href="http://www.bloggerplugins.org">Blogger Widgets </a></span>

Now you are done.It will look like this.



I found this useful tip from www.bloggerplugins.org