Wednesday, September 19, 2007

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-

--

11 comments:

Anonymous said...

Very helpful tip,works like a charm. thank you!
Manaz

Rhyne said...

You rock! Works perfectly!

Anonymous said...

thank you so so so very much!!

Red Tory said...

I was having a hard time figuring out where to place the code in my template and you provided the answer. Thanks much!

Unknown said...

after 2 hours of trying to figure this thing out it only took a minute after reading your tip...Thanks!!!

Anonymous said...

Thanks so much. I was having some issues with Addthis for Blogger, but this solved that issue and posted the widget on every post...great information!

Hairlicious Inc. said...

Thank you so much! your code was sooooooo simple and easy!!! Keep it up.

Anonymous said...

This won't work with apostrophes in the post title.

Add to Any has an FAQ entry for the Share/Save widget:

http://www.addtoany.com/buttons/faq/#blogger_posts

Fiz Dosani said...

its working man!
Keep it up

Jay Watts III said...

Ahh, thank you very much! That was about to cause me a whole morning of frustration when I stumbled across your blog!

Unknown said...

Thanks a lot