Adding Social boomarking buttons to blogger
Learn how to add simple bookmarking icons to make it easier for your users to share your content. Put small icons to different social bookmarking and sharing sites below each post.
We all know the importance of socially sharing our blog and publicizing it. It helps you gain traffic and also to brand your blog. So here is the tutorial, just follow the steps to add social bookmarking icons. This trick is only for Blogger users for wordpress go here

Go to "Layout" section, then click on "Edit HTML" link.

Then click on "Expand Widget Templates". Now find (CTRL+F) this code:


Then immediately after that code, add these lines:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>digg_url=&quot;<data:post.url/>&quot;;</script><script src='http://digg.com/tools/diggthis.js' type='text/javascript'/>
<a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Stumbleupon' src='http://www.mozilla.com/img/tignish/add-ons/stumbleupon.png'/></a>
<a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Delicious' src='http://www.pocketsmith.com/wp-content/themes/pocketsmith/images/Delicious-48x48.jpg'/></a>
<a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url' rel='external nofollow' target='_blank'><img alt='Technorati' src='http://www.birdorable.com/blog/img/technorati.gif'/></a>
<a expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url' rel='external nofollow' target='_blank'><img alt='Twitter' src='http://www.getelastic.com/wp-content/themes/default/images/twitter-logo.png'/></a>
<a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Facebook' src='http://wheelsnorth.campyonly.com/images/logos/facebook-logo%5B1%5D.jpg'/></a></b:if>

The black bolded code hides these icons in your Home-Page and only shows them below your posts.

This code was initially provided by bloggerstop.net but it was not complete so i have improved the code and have put up the updated version.

Thanks to Bloggerstop.net


Post a Comment