Add social bookmarking icons below blogger posts
4:36 PM Posted by Preetish Panda
These days their are lots of articles floating over the internet.What if some of your reader wants to bookmark a perticular post rather than bookmarking your home page.Digg,Del.icio.us are prominent name in social bookmarking as they provide users this facility.Human is a social animal and people tend to share what they love.That's why social bookmarking has taken fast a pace in the road ahead.When posts are bookmarked, they help in generating more audience.
1.Log in to your blogger dashboard ,click on layout and then on edit html.
2.Back up your template in case anything goes wrong.
3.Click on "Expand Widget Templates".
4.Now search (CTRL + F) for <data:post.body/> .In some templates it might be <p><data:post.body/></p> .
5.Copy the code given below and paste it into a wordpad ,notepad or notepad++ .
<!--SOCIAL-BOOKMARKING-ICONS-STARTS-->
<b:if cond='data:blog.pageType == "item"'>
<!--DIGG-->
<a expr:href='"http://digg.com/submit?phase=3&url=" + data:post.url' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",1);"' rel='nofollow' target='_blank'><img alt='DiggIt!' src='Your Link Here'/></a>
<!--Stumble-->
<a expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='external nofollow' target='_blank'><img alt='Stumble' src='Your Link Here'/></a>
<!--Delicious-->
<a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' rel='external nofollow' target='_blank'><img alt='Delicious' src='Your Link Here'/></a>
<!--Technorati-->
<a expr:href='"http://technorati.com/faves?add=" + data:post.url' rel='external nofollow' target='_blank'><img alt='Technorati' src='Your Link Here'/></a>
<!--Twitter-->
<a expr:href='"http://twitthis.com/twit?url=" + data:post.url' rel='external nofollow' target='_blank'><img alt='Twitter' src='Your Link Here'/></a>
<!--Facebook-->
<a expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url + "&t=" + data:post.title' rel='external nofollow' target='_blank'><img alt='Facebook' src='Your Link Here'/></a>
<!--Google-->
<a expr:href='"http://www.google.com/bookmarks/mark?op=add&bkmk=" + data:post.url + "&title="+data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",19);"' rel='nofollow' target='_blank'><img alt='Google' src='Your Link Here'/></a>
<!--Yahoo-->
<a expr:href='"http://myweb2.search.yahoo.com/myresults/bookmarklet?u=" + data:post.url + "&=" + data:post.title' expr:onmouseout='"javascript:showsbtext (\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",4);"' rel='nofollow' target='_blank'><img alt='Yahoo' src='Your Link Here'/></a>
</b:if>
<!--SOCIAL-BOOKMARKING-ICONS-STOPS -->
6.Now go to hotlinkfiles.com.
7.Register an account.
8.Now get your glossy and beautiful social bookmarking icons from here.
http://directoryfordesigners.com/50-free-social-media-icon-sets-for-your-blog
or from here
http://www.freeiconsdownload.com/Free_Web_Icons.asp
9.Upload the icons to your hotlinkfiles account.
10.Get the direct links of the uploaded icons.
11.Paste those direct links in place of "Your Links Here" in the code already present in the notepad or text editor.
12.Now paste the final code just below <p><data:post.body/></p> .
13.Save the template and you are done.
If you are having any problem just post here and I'll surely help you out.
Click here to Subscribe news feed from "TechFuzon", so that you do not miss out anything that can be valuable to you !!
















July 8, 2009 6:57 AM
Just love the icons you selected for your blog! I also have some large colorful ones on my blog.