Tim Brockman . com

W3C, addThis & AddToAny vs. DIY social bookmarks in wordpress

• Tim Brockman
• @ 6:04 am

This week I spent some time submitting sites to ye ole W3 validator. Usually this is a quick process of adding the occasionally missed alt in my img tags and amp;s to my &'s but every once in a while I stumble onto something I can't fix. The standard addThis buttons will validate fine but the api features that allow you to chose custom buttons won't. According to the addThis Tech Support forum the toolbox features will not validate in the foreseeable future. I tried every workaround I could think of to no avail.

The only solution you can guarantee will validate and look exactly how you want is your own custom solution. But before opening that can of worms look at the solutions available to see if one fits your needs.

This made me think about shopping around a bit. In the end my 2 favorites are still addThis and AddToAny. AddToAny seems to be a little beefier with an exhaustive list of services. I still like the invalid toolbox of addThis beta API vs. the AddToAny API. At one point I used the obsocialbookmarking plugin for wordpress but the chicklets were slow to load so eventually I dropped it. After looking into it again it seems they've got it to work better than before, and the wordpress control is a nice feature.

In the end for wordpress I'm back to suggesting obsocialbookmarking over addThis or AddToAny.

Well why not do it yourself? You may loose the simple service tracking, if you get around to use it, but the tradeoff is the complete freedom to add any available service. What if your market is in a foreign country like India or Brazil where social networking is flourishing? You aren't going to wait for addThis to add IndianPad or Rec6, or whatever your readers are into.

There is always the option of adding the bookmarks on your own. If you're using WordPress, it isn't a big process. Properly include the link in the Loop and it will show up after every post. Add a local copy of the favicon/chicklet in an images folder for quick loading and stability and you're good to go. If you add a new service don't forget to & your &'s so it validates and you're good to go.

Here's the sample code with a few common services to get you started:


<!-- custom social bookmark buttons -->
<a href="http://del.icio.us/post?url=<?php echo urlencode(get_permalink($id)); ?>&amp;title=<?php echo urlencode(get_the_title($id)); ?>" target="_blank" title="Save to del.icio.us"> <img src="images/delicious.gif" width="16" height="16" alt="del.icio.us" style="float:none"/>del.icio.us</a>

<a href="http://slashdot.org/bookmark.pl?url=<?php echo urlencode(get_permalink($id)); ?>&amp;title=<?php echo urlencode(get_the_title($id)); ?>" target="_blank" title="Slashdot It!"> <img src="images/slashdot.gif" width="16" height="16" alt="Slashdot" style="float:none"/>Slashdot</a>

<a href="http://digg.com/submit?phase=2&amp;url=<?php echo urlencode(get_permalink($id)); ?>&amp;title=<?php echo urlencode(get_the_title($id)); ?>" target="_blank" title="Digg This Post!"> <img src="images/digg.gif" width="16" height="16" alt="Digg" style="float:none"/>Digg</a>

<a href="http://www.facebook.com/share.php?u=<?php echo urlencode(get_permalink($id)); ?>" target="_blank" title="Share on Facebook!"> <img src="images/facebook.gif" width="16" height="16" alt="Facebook" style="float:none"/>Facebook</a>

<a href="http://technorati.com/faves?add=<?php echo urlencode(get_permalink($id)); ?>" target="_blank" title="Add to my Technorati Favorites!"> <img src="images/technorati.gif" width="16" height="16" alt="Technorati" style="float:none"/>Technorati</a>

<a href="http://www.stumbleupon.com/submit?url=<?php echo urlencode(get_permalink($id)); ?>&amp;title=<?php echo urlencode(get_the_title($id)); ?>" target="_blank" title="Stumble it!"> <img src="images/stumble.gif" width="16" height="16" alt="StumbleUpon" style="float:none"/>StumbleUpon</a>

<!-- end custom bookmarks -->

If you fear such voodoo as the outbound links draining your 'link juice' you can always use a JavaScript function to create these links on the fly*, at which point you've created your own mini addThis/AddToAny service. I'll probably get to that by the time I proofblish this.

*Google does crawl basic JavaScript, looking for URLs. But this is a whole different topic.