Thursday, January 14, 2010
Widgets
Do you want to show the most popular blog posts to your readers? Here is a widget which can be placed anywhere in your blog. This "Most popular posts" widgets is also known as "Most Commented Post" widget.
Log into Blogger > Layout > Page Elements. Then click "Add a gadget" and select "HTML/Javascript". Now, all you have to do is to copy and paste these codes below.
<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ol style="text-transform: capitalize;">');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ol>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&
_callback=pipeCallback&_id=1a1c6e4e6d4f148e3650fda46910e15f&url
=http%3A%2F%2Fyourblogname.blogspot.com_without HTTP://&num=10" type="text/javascript"></script>
<noscript><a href="http://introblogger.blogspot.com/2010/01/add-popular-posts-widget-in-blogger.html" target="_blank">Get This Widget</a></noscript>
function pipeCallback(obj) {
document.write('<ol style="text-transform: capitalize;">');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ol>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&
_callback=pipeCallback&_id=1a1c6e4e6d4f148e3650fda46910e15f&url
=http%3A%2F%2Fyourblogname.blogspot.com_without HTTP://&num=10" type="text/javascript"></script>
<noscript><a href="http://introblogger.blogspot.com/2010/01/add-popular-posts-widget-in-blogger.html" target="_blank">Get This Widget</a></noscript>
How to customize it?
Replace the text highlighted with orange colour with your blog's URL without http://.
The default number of posts to be shown is 10. You can set the number of posts that you want to show by replacing the number highlighted with green colour.
The default widget will show title of the post and without number of comments. If you want show number of comments, replace the code highlighted with blue colour with codes below.
- 1a1c6e4e6d4f148e3650fda46910e15f will display it with no count.
- a7d3195528df5e96181a3d2712266226 will display with a count (23)
- 1cf38ae68efbe859c4ba1ee239cec099 will display like this (23 comments)
And click "Save".
Subscribe to:
Post Comments (Atom)
2 comments:
not working,i follow ur tutorial but the widget not appear at my blog http://www.otakworks.net
I like blogger, I learn everything in this blog. I must say that A very well constructed tutorial, I might do this in the future.Thanks for sharing...
Post a Comment