AddThis Widget & New Blogger Templates - HOWTO

I tried adding the "cool" new version of the AddThis bookmarking widget to this blog and found that it did not work as advertised. It was shown to have a dropdown menu, but that was not the case.

This is most likely due to the new lingo blogger's new templates use.

I searched for a bit until my patience timer ran out and having found no information with a fix -- I wrote one myself.

Rather than have a lot of people ask me how to make it work I thought I'd save myself a ton of time and just post a short HOWTO right here where you can see it working.

First register yourself with AddThis if you haven't already.

Now follow these instructions:

1.) Log into your Blogger account
2.) Go to 'Edit HTML'
3.) Click 'Expand Widget Templates'
4.) Search for: <!-- quickedit pencil -->
5.) Add the following code immediately above it -- no edits required

<!-- AddThis Bookmark Button BEGIN -->
<div class="snarf-border">
<script type = 'text/javascript'>
  addthis_url   = '<data:post.url/>';
  addthis_title = '<data:post.title/>';
  addthis_pub   = '<data:blog.url/>';
</script><script
 src='http://s7.addthis.com/js/addthis_widget.php?v=12'
 type='text/javascript' />
</div>
<!-- AddThis Bookmark Button END -->

If your template adds borders to images and you don't want this widget to have a border then go to the top of the template and search for:

body {

then find the closing brace '}' for the 'body {' block and right beneath it add the following code:

.snarf-border a img { border: none; }

-frank-

--