Wednesday, 13 April 2011

Add Addthis buttons Above, Not After each blogger/blogspot post

Share |

Add Addthis toolbar Above or before of each blogger post, not at the tail end!

*This post assumes you already have a blog on blogger.

Everyone is adding these social sharing toolbars these days, and what we shall look at here today is not whether their effects are useful, but rather its implementation.

Add blogger widget feature, but not what we want here.

Addthis.com has thoughtfully allowed us to conveniently add its toolbar as a blogger widget. After trying it out however, I realized that it uses javascript. And it puts the Addthis toolbar to AFTER every blog post automatically. But I wanted it BEFORE. After playing around, it seemed rather hard to massage into place, so I thought heck, lets start from scratch.


Steps to put Addthis where it belongs (at the start of every blogpost):
1. This time, select the "Website" option instead of the "Blogger" option from the Addthis website.

Select the "Website" option instead.

2. Copy the code from the right textbox.
3. Login into your blogger account and enter the desired blog's Design->Edit Html tab.
4. Remember to save a template backup if necessary.
5. Click Expand Widget Templates to reveal the full code.
6. Now search for the lines <div class='post-body entry-content'> and  <data:post.body/>
7. We want to stick the copied Addthis code in BETWEEN these 2 lines.
8. Click Preview or go ahead and Save Template if you are feeling confident today.

We are good to go once again.


Remember to click "Expand Widget Templates"
XGRCXDMVTM54 

1 comment:

Comments will be moderated.
You can always click 'Contact me' link to get in touch directly.