Learn Share And Tips: Social bookmarking elements after each blog post

This is the updated version of my previous post post on the same.. in this i have added a new stumble upon button.If you use this you will get the bookmarking icons after each blog post as you see on my blog here . To get this working on your blog do the following steps..

1)Goto Blogger Template>Edit HTML back up your template and expand the widget templates..
2)Now in your template replace

<head>

with

<head>
<script src='http://files.bloggerplugins.org/simpletricks.js'></script>

Tips:you can download the simpletricks.js and upload your own host space,like googlepages,google code.Click here and download it.

3)Now find

<p class='post-footer-line post-footer-line-3'>

and place the following code just below that line or the place where you want to insert to.

<table align='left' border='0' cellpadding='0' width='100%'>
<tr>
<td style='vertical-align:middle' valign='middle' width='30%'>
<div expr:id='"sbtxt"+data:post.id'>Bookmark this post:</div><script type='text/javascript'>showsbtext("sbtxt" + "<data:post.id/>",0)</script>
</td>
<td>
<a expr:href='"http://www.stumbleupon.com/submit?url=" + 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='StumpleUpon' src='http://files.bloggerplugins.org/icon_sb_stumb.gif'/></a>
<a expr:href='"http://ma.gnolia.com/bookmarklet/add?url=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",6);"' rel='nofollow' target='_blank'><img alt='Ma.gnolia' border='0' src='http://files.bloggerplugins.org/icon_sb_mag.gif'/></a>
<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='http://files.bloggerplugins.org/icon_sb_dig.gif'/></a>
<a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",2);"' rel='nofollow' target='_blank'><img alt='Del.icio.us' src='http://files.bloggerplugins.org/icon_sb_del.gif'/></a>
<a expr:href='"http://www.blinklist.com/index.php?Action=Blink/addblink.php&Description=&Url=" + data:post.url + "&Title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",3);"' rel='nofollow' target='_blank'><img alt='Blinklist' src='http://files.bloggerplugins.org/icon_sb_bli.gif'/></a>
<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='http://files.bloggerplugins.org/icon_sb_yah.gif'/></a>
<a expr:href='"http://www.furl.net/storeIt.jsp?u=" + data:post.url + "&t=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",8);"' rel='nofollow' target='_blank'><img alt='Furl' src='http://files.bloggerplugins.org/icon_sb_fur.gif'/></a>
<a expr:href='"http://www.technorati.com/cosmos/search.html?url=" + data:post.url' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",9);"' rel='nofollow' target='_blank'><img alt='Technorati' src='http://files.bloggerplugins.org/icon_sb_tec.gif'/></a>
<a expr:href='"http://www.simpy.com/simpy/LinkAdd.do?href=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",10);"' rel='nofollow' target='_blank'><img alt='Simpy' src='http://files.bloggerplugins.org/icon_sb_sim.gif'/></a>
<a expr:href='"http://www.spurl.net/spurl.php?url=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",11);"' rel='nofollow' target='_blank'><img alt='Spurl' src='http://files.bloggerplugins.org/icon_sb_spu.gif'/></a>
<a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' expr:onmouseout='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",0);"' expr:onmouseover='"javascript:showsbtext(\"sbtxt" + data:post.id + "\",17);"' rel='nofollow' target='_blank'><img alt='Reddit' src='http://files.bloggerplugins.org/icon_sb_red.gif'/></a>
<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 + "\",20);"' rel='nofollow' target='_blank'><img alt='Google' src='http://files.bloggerplugins.org/icon_sb_goo.gif'/></a>
</td>
</tr>
</table><br/>

if every thing went correctly this is what you should get

and also some mouse over animation as you see on the icons below this post.. Now you can remove the unwanted buttons by removing the corresponding tag.You can also change the button images if you like.I am looking for some better bookmarking icons(especially for that stumbleUpon).If anybody has it please leave a comment here.
Credits to Beautiful Beta for this awesome javascript

6 comments:

AnonymousJanuary 6, 2009 at 8:29 PM
Your blog is very nice
bollywood girlsJanuary 6, 2009 at 8:37 PM
i like your blog
AnonymousJanuary 8, 2009 at 6:49 AM
There is no

p class='post-footer-line post-footer-line-3'

tag in my blogger theme HTML ( XML ) !
what can I do ?
plz help
UnknownJuly 10, 2009 at 9:32 AM
don't use my social bookmarking icons without a link to my site.. If you use these buttons you have to preserver the link to my website.. . If you want to do so just download those icons and upload them to your hosting and link to those icons. I cant afford so much bandwidth on my site..

Aneesh
www.bloggerplugins.org
buy facebook fans/likesAugust 26, 2012 at 10:01 AM
Thanks for the sensible critique. Me & my neighbor were just preparing to do a little research on this. We got a grab a book from ourbuy facebook fans/likes, local library but I think I learned more from this post. I'm very glad to see such fantastic information being shared freely out there.
UnknownMarch 25, 2014 at 3:22 PM
This is the updated version of my previous post post on the same.. in this i have added a new stumble upon button. Social Bookmarking Service

Learn Share And Tips

Dec 12, 2008

Social bookmarking elements after each blog post

6 comments:

Pages