How to Display Delicious Bookmark Count on Wordpress Blog or Any Website Page

Almost all of social bookmark and microblogging sites like Twitter, Facebook, Digg, and Stumbleupon have their own code to display the save or bookmark count for certain website page. Otherwise, you can find easily the third party tools to display the count like Twitter, there’re quite many retweet count tools out there.

Unlike Delicious, I can’t find easily the code to display Delicious bookmark count. By doing little modification of code from w3avenue – How to Get Digg, Delicious and Tweet Counts Using jQuery you can display nice looking Delicious bookmark count. So you’ll know easily how many times your url has been added to Delicious. Here’s the preview:

 

To download the image, please right click on the image then select “Save Image As”.

I have styled the data using CSS and you can also do this without depending on any server side code.

Display Delicious Bookmark Count on Wordpress Blog

Here’s the code to display Delicious bookmark count on Wordpress blog. On your WP admin dashboard, go to Appearance -> Editor. To place this on your front page, please open your index.php file then paste the code where you wish. To place on your single post, please open your single.php file then paste the code.

01

02

1

2

<a href="http://delicious.com/save" id="delicious-ID; ?>" onclick="window.open('http://delicious.com/save?v=5&noui&jump=close&url='+encodeURIComponent('php the_permalink() ?>')+'&title='+encodeURIComponent('php the_title() ?>'), 'delicious','toolbar=no,width=550,height=550'); return false;" style="display:block; color:#000; font:normal 16px arial; text-decoration:none; padding-top:3px; background:url(http://www.webmasteradvance.com/wp-content/uploads/2010/07/delicous_50.png) no-repeat; width:50px; height:60px; text-align:center;">a>

Display Delicious Bookmark Count on Any Website Page

And here’s the code to display Delicious bookmark count on any website page.

01

02

1

2

<a href="http://delicious.com/save" id="delicious" onclick="window.open('http://delicious.com/save?v=5&noui&jump=close&url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title), 'delicious','toolbar=no,width=550,height=550'); return false;" style="display:block; color:#000; font:normal 16px arial; text-decoration:none; padding-top:3px; background:url(images/delicous_bg.png) no-repeat; width:50px; height:60px; text-align:center;">a>

Please replace the style image background (which it’s http://www.webmasteradvance.com/wp-content/uploads/2010/07/delicous_50.png on this example) with your own image url.