Put del.icio.us Button With Counter In Blogger Posts

Posted by jcargoo | Thursday, April 23, 2009
| 0Delicious Twitter Reddit Digg Loading...

This is article will show you how to add a del.icio.us link with a counter displaying the users number that bookmarked the current article in del.icio.us.

del.icio.us is a famous social bookmarking service which gives for all users

a great opportunity to discover millions of unique URLs bookmarked.

Therefore, if you accept to show a simple/reachable link to bookmark your post as well as to show how many users have bookmarked this post, this will doubtlessly be a manner to move up your article’s popularity.

The result will be like this:

How to do that:

1 - Go to your Layout, Edit your template and Expand Widget Templates.

2 - Add the following CSS classes

padding:2px 4px;
background:url(“Use Your 14x14 delicious Logo URL”) left no-repeat; padding:0 10px 0 20px;
font-weight: bold;

3 – Place this following code snippet just before <b:includable id='post' var='post'> in case of you want to display it like in this site. Otherwise, you can choose your convenient position within the Blogger template and edit the appropriate CSS classes.

<span class='delicioushits'>
<a expr:href='"http://del.icio.us/post?url="+ data:post.url + "&title=" + data:post.title' target='_blank'>Save to del.icio.us</a> with
<span class='delicioushitsbold' expr:id='"a"+data:post.id'>0</span> hits!</span>

<script type='text/javascript'>
function displayURL(data) {
var urlinfo = data[0];
if (!urlinfo.total_posts) return;
document.getElementById('a<data:post.id/>').innerHTML = urlinfo.total_posts;
<script expr:src='"http://badges.del.icio.us/feeds/json/url/data?url= " + data:post.url + "&callback=displayURL"'/>

4- This was successfully tested in Chrome, FF, Safari and IE.

5- Enjoy yourself.

How to encourage this blog if you like it:
  • Promote our sponsors;
  • Add any kind of comment or critic;
  • Ask me directly by email if you prefer.
Just do something like that, and I will have the huge pleasure to continue posting the best of the creativity I have.

Share this post ?

Digg Reddit Stumble Delicious Technorati Twitter Facebook

0 Previous Comments