How To Create Dynamic Digg/Reddit/Del.icio.us Buttons For Your Pages (Includes Code)

By Daniel Miessler on January 16th, 2007: Tagged as Blogging | Delicious | Digg | Reddit | Social

Everyone’s seen the cool little icons/buttons for Digg, Reddit, and Del.icio.us shown under various articles online. They make it easy for users to submit to their favorite social site by automatically filling in the title of your page. I also think they subconsciously add legitimacy to a web presence. In short, they’re just great to have.

A number of plugins can be installed in your blogging software to enable this functionality, but what happens if you want to use these little jems on your own static content? I wondered the same thing and made my own.

Here’s the code (click the image):

<a href="javascript:location.href='http://digg.com/submit?phase=2&url='+encodeURIComponent(document.location.href)+' '">
<img class="borderless" src="http://dmiessler.com/images/digg.gif"alt="Submit to Digg" height="18" width="18" /></a> &nbsp;
<a href="javascript:location.href='http://reddit.com/submit?phase=2&url='+encodeURIComponent(document.location.href)+' '">
<img class="borderless" src="http://dmiessler.com/images/reddit.gif"alt="Submit to Reddit" height="17" width="17" /></a> &nbsp;
<a href="javascript:location.href='http://del.icio.us/post?v=2&url='+encodeURIComponent(document.location.href)+'&title='+encodeURIComponent(document.title)+' '"><img class="borderless" src="http://dmiessler.com/images/delicious.gif"alt="Bookmark at Del.icio.us" height="16" width="16" /></a>

  • Digg
  • Reddit
  • HackerNews
  • StumbleUpon
  • DZone
  • Google Bookmarks
  • Twitter
  • Facebook
  • del.icio.us
  • FriendFeed
  • Posterous
  • RSS
  • email
  

View Comments

  • Tim
    The only problem I have with this code is that it relies on Javascript to work.

    Generally it's bad to statically assign a javascript action to a link. If someone with javascript disabled clicked the link, nothing would happen. Javascript is meant to make the page more convenient without destroying functionality for non-javascript users.

    It's not too hard to create a piece of php code that would do the same thing, and it doesn't force the client to have any special settings. If you wanted to change it so it opens a popup for the link, you can add a DOM script to the page that would change the link href when the page is loaded.
blog comments powered by Disqus

 

twitter_icon

Sample Original Content


Information Security

Tutorials and Primers

Culture & Society

Technology & Science

Politics

Philosophy & Religion

Miscellaneous

Tools & Projects


Blog Archives