Add Sexy Bookmarks to Blogger

Update: Get the latest SexyBookmarks widget from here

Hello Fellow bloggers! Good news for blogger.com users, now they can add the Sexy-bookmark wordpress plugin. by following these simple steps:

Now, Lets begin.

!Before changing your template, don’t forget to backup your template and your widgets! 1. First of course go to your template editor and tick the ‘Expand Widget Template’. 2. Put this code before </head>

<style type='text/css'> div.sexy-bookmarks { height:54px; background:url('http://i43.tinypic.com/2ueii3t.png') no-repeat left bottom; position:relative; width:540px; }
div.sexy-bookmarks span.sexy-rightside { width:17px; height:54px; background:url('http://i43.tinypic.com/2ueii3t.png') no-repeat right bottom; position:absolute; right:-17px; }
div.sexy-bookmarks ul.socials { margin:0 !important; padding:0 !important; position:absolute; bottom:0; left:10px; }
div.sexy-bookmarks ul.socials li { display:inline-block !important; float:left !important; list-style-type:none !important; margin:0 !important; height:29px !important; width:48px !important; cursor:pointer !important; padding:0 !important; }
div.sexy-bookmarks ul.socials a { display:block !important; width:48px !important; height:29px !important; font-size:0 !important; color:transparent !important; }
.sexy-furl, .sexy-furl:hover, .sexy-digg, .sexy-digg:hover, .sexy-reddit, .sexy-reddit:hover, .sexy-stumble, .sexy-stumble:hover, .sexy-delicious, .sexy-delicious:hover, .sexy-yahoo, .sexy-yahoo:hover, .sexy-blinklist, .sexy-blinklist:hover, .sexy-technorati, .sexy-technorati:hover, .sexy-facebook, .sexy-facebook:hover, .sexy-twitter, .sexy-twitter:hover, .sexy-myspace, .sexy-myspace:hover, .sexy-mixx, .sexy-mixx:hover, .sexy-script-style, .sexy-script-style:hover, .sexy-designfloat, .sexy-designfloat:hover, .sexy-syndicate, .sexy-syndicate:hover, .sexy-email, .sexy-email:hover { background:url('http://i44.tinypic.com/1znbj83.png') no-repeat !important; }
.sexy-furl { background-position:-300px top !important; }
.sexy-furl:hover { background-position:-300px bottom !important; }
.sexy-digg { background-position:-500px top !important; }
.sexy-digg:hover { background-position:-500px bottom !important; }
.sexy-reddit { background-position:-100px top !important; }
.sexy-reddit:hover { background-position:-100px bottom !important; }
.sexy-stumble { background-position:-50px top !important; }
.sexy-stumble:hover { background-position:-50px bottom !important; }
.sexy-delicious { background-position:left top !important; }
.sexy-delicious:hover { background-position:left bottom !important; }
.sexy-yahoo { background-position:-650px top !important; }
.sexy-yahoo:hover { background-position:-650px bottom !important; }
.sexy-blinklist { background-position:-600px top !important; }
.sexy-blinklist:hover { background-position:-600px bottom !important; }
.sexy-technorati { background-position:-700px top !important; }
.sexy-technorati:hover { background-position:-700px bottom !important; }
.sexy-myspace { background-position:-200px top !important; }
.sexy-myspace:hover { background-position:-200px bottom !important; }
.sexy-twitter { background-position:-350px top !important; }
.sexy-twitter:hover { background-position:-350px bottom !important; }
.sexy-facebook { background-position:-450px top !important; }
.sexy-facebook:hover { background-position:-450px bottom !important; }
.sexy-mixx { background-position:-250px top !important; }
.sexy-mixx:hover { background-position:-250px bottom !important; }
.sexy-script-style { background-position:-400px top !important; }
.sexy-script-style:hover { background-position:-400px bottom !important; }
.sexy-designfloat { background-position:-550px top !important; }
.sexy-designfloat:hover { background-position:-550px bottom !important; }
.sexy-syndicate { background-position:-150px top !important; }
.sexy-syndicate:hover { background-position:-150px bottom !important; }
.sexy-email { background-position:-753px top !important; }
.sexy-email:hover { background-position:-753px bottom !important; } </style>

3. Now Put the below code after <data:post.body/>
<div class='sexy-bookmarks'><ul class='socials'><li class='sexy-delicious'><a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Add to Delicious' rel='nofollow'/></li>
<li class='sexy-digg'><a expr:href='&quot; http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Digg This Post' rel='nofollow'/></li>
<li class='sexy-technorati'><a expr:href='&quot; http://technorati.com/faves?add=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Add to Technorati' rel='nofollow'/></li>
<li class='sexy-reddit'><a expr:href='&quot; http://www.reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Add to Reddit' rel='nofollow'/></li>
<li class='sexy-stumble'><a expr:href='&quot; http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Stumble This Post' rel='nofollow'/></li>
<li class='sexy-designfloat'><a expr:href='&quot;http://www.designfloat.com/submit.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share on DesignFloat' rel='nofollow'/></li>
<li class='sexy-facebook'><a expr:href='&quot; http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share on Facebook' rel='nofollow'/></li>
<li class='sexy-twitter'><a expr:href='&quot; http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share on Twitter' rel='nofollow'/></li>
<li class='sexy-furl'><a expr:href='&quot; http://www.furl.net/storeIt.jsp?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share on Furl' rel='nofollow'/></li>
<li class='sexy-syndicate'><a href='http://feeds2.feedburner.com/naeemnur' title='Subscribe to RSS' rel='nofollow'/></li>
<li class='sexy-email'><a expr:href='&quot; mailto:?subject=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share on Email' rel='nofollow'/></li>
</ul><span class='sexy-rightside'/></div>

Dont Forget to replace my feedburner id(naeemnur) with yours. As for the wordpress users they can download the plugin here you can see the demo below>

102 thoughts on “Add Sexy Bookmarks to Blogger

  1. Hey Great Post Thanks for the info

    These look so cool Can you do the same with my own hosted wordpress blog ?

  2. Hi naeem, there is something wrong with the code. I tried to copy paste of your HTML that shown, there is error message from blogger.

    the error is because of these tags "&title="

    I modify every tags "&title=", "&amp;title=". Now, it's gone fine… 🙂

  3. nice template you have here Naeem 😀

    nice article, i’ll use it as the replacement of my old social-bookmark icon, this one have a nice hover effect, i like it 🙂

  4. i wonder if the word "sharing is sexy" can be replaced with something like this ( for example ) : "What Next?" too bad i'm suck in design ( as well as coding for sure ) >_<

  5. man, it’s pretty sad when someone else reposts my work and gets more diggs than the original article. LOL

    Good job though converting it to Blogger format.

  6. This is so great. However mine keeps saying

    “The reference to entity “title” must end with the ‘;’ delimiter.”

    when I try putting in the second part of the code.

    Please help?

  7. Buddy. Thanks again. I implemented this on my blog 😀 I really like it now woot!

    Thanks muchly 😀

  8. This is awesome, but it seems the Furl link is no longer valid. Do you have a fix for this?

  9. @Carl Jordan:

    v2.3 of SexyBookmarks plugin contains Diigo (the company that has absorbed Furl)

    You can easily dig through the code and replace the section for Furl with the section from the WP Plugin that pertains to Diigo and also replace the image to reflect Diigo rather than Furl as well.

  10. @eCommerce Library as far as I know this is no way near related to read more hack, just follow the steps and it will be done.

  11. I applied but it says the following error:-

    Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
    XML error message: Open quote is expected for attribute “{1}” associated with an element type “type”.

  12. Submit Links to Social Bookmarking Websites Automatically! Get Thousands of Visitors! Increase Website Traffic and Income with Automatic Social Bookmarks Submitter. Prepare to upgrade your servers today – you will have thousands of real and highly targeted visitors who will make you the money like crazy!

  13. Hi!!!

    Thanks! I was saw this Bookmark in a Blog and wondered where could i find the code!!!!!
    I found it 🙂

  14. And who does not wish to pay for a hosting, is urgent here – the best free web hosting!

  15. Pingback: Blogger Paylaşmak Güzeldir Sosyal Ağ Butonları (İlk Kez Türkçe)
  16. I applied but it says the following error:-

    Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
    XML error message: Open quote is expected for attribute “{1}” associated with an element type “type”.
    please mail me or comment in my blog jayarajyadav.blogpsot.com

    jayaraj’s last blog post..contact me

  17. Pingback: Sexy Auto Hide Social Bookmarking Widget For Blogger | Online Wordpress & Blogger Template
  18. hey, im just curious… wat happened to the “SHARING IS SEXY” widget?? it became… i dunno. It doesn’t appear anymore.. please help us. thank u!! 🙂

  19. Thanks for sharing. Have put in on my blog and it looks great.

    Just a question, which paramter should I change if I want to shorten it? My center coloumn is narrow and it sort of “exceeded”…

  20. Okay my code is all up but… ? not showing the little flash buttons? Any idea why??

    Is the 590 pixels too wide? And can I cut it down to only 4 or 5 buttons??
    .-= Carissa´s last blog ..Kid Crafts to Beat the Boredom: Week 3 =-.

  21. I’ve seen this code on several pages now. I’m guessing a lot of people are copying your script. Anyway, thanks for sharing. Sharing is sexy!

  22. Hi, I tried to add it to my blog.

    but after doing both the steps properly, my blog is not displaying any post at all.

    I am using scribe template with some widgets.

    Could any one help me ???

  23. This would have been a good widget – however you have made one major error which makes this dysfunctional : you have forgotten to close all of your tags with the closing tag , therefore : this will not work for anyone , unless they see the error beforehand & correct it . You should also correct it as well 🙂
    .-= Mia´s last blog ..Best Social Media Icons =-.

  24. Why does my post not appear?
    .-= Tutorial Blog´s last blog ..5 Tips Dasar SEO Untuk Pemula =-.

  25. Pingback: Add Sexy Bookmarks to Blogger | Css Reflex – Design Blog | Web Design | Inspiration and Resources for Designers
  26. Still not working it is saying:

    Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
    XML error message: The reference to entity “title” must end with the ‘;’ delimiter.

  27. hai naeem, i find your posts very interesting and is trying to follow your instrution. however, i cannot find the code in my css 😀
    i don’t know wheter the problem lies in my template or anything. but it would be very nice if you could help me 🙂
    i am curretntly using the “Aku Bontoo” theme btw..

    thx

  28. Worked perfectly for my webiste http://www.icttrens.com and I’m extremely happy. Thank you very much for this great share. I digged, stumbled, reddited, and delicious. I don’t have other accounts otherwise I’d have done them too. I followed the author on twitter too!
    .-= Suresh Khanal´s last blog ..Reader-friendly Blog Design – Checklist. =-.

  29. Thanks for this post. I have added this feature on my blog http://rohanrawat.blogspot.com .. So far its working ok.

    I want to add previous and next option below the post. I want to display only one post at a time. Even when a label item is selected or a month is selected from archieve, i want to display only one post with previous and next option to browse rest of the posts..How can i do that…Please share the code for doing this..

    Thanks for the sexy sharing code..

    God Bless..

    Rohan
    .-= Rohan´s last blog ..Cadbury Dairy Milk Silk ‘Conference’ Ad !!! =-.

  30. Naeem, I’ve installed this and is awsome I love it, but whenever I try to use the twitter button it is said that the page can’t be redirected, is there any chance to change it for twitmeme? or similar because twitthis seems not to be working.
    Thanks! (I hope my English is clear enough)
    .-= Pabela´s last blog ..La carretera- The Road- John Hillcoat-2009 =-.

  31. Thanks I tried both versions and got this:

    Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
    XML error message: The content of elements must consist of well-formed character data or markup.

    I placed them in the right spots too so I don’t know why.

  32. Ok I got it to showup but its positioned itself into my left sidebar I have no idea how to fix this please help D:

  33. Pingback: Blogger Paylaşmak Güzeldir Sosyal Ağ Butonları (İlk Kez Türkçe), Blogger Paylaşmak Güzeldir Sosyal Ağ Butonları (İlk Kez Türkçe) programı | Youtube | İzlesene | Program | Program indir
  34. Hi! Thanks for posting this. It was so easy to follow!

    I do have a question though.. when I posted it on my blog, it posted to the short version of each post on the main page.

    But when I click on a particular post, the sexy bookmarks don’t show up at the bottom. Is there a way to have them show up on the bottom of an entire post as well?

    Thanks!

    Best,
    Li
    @LaLicenciada

  35. Guys! Images are removed by hosting thats why these are not working. Click my name to get access to latest tutorials. Or open :
    Hackers Thirst dot com
    Regards,
    Wamiq Ali

  36. Yah images aren’t working anymore so Im trying to configure how to change the url location of the image .. anyway thanks…

  37. I would still love to change my text on my widget from Sharing is Caring back to Sharing is sexy. I have it self hosted but have no idea how to get to it since you have to put in a certain demension on the coding for it to appear. Any thoughts?

  38. hello, I followed your steps but when I try to share an article from my blog via Facebook (using either a custom button to default blogspot, the result is the same) instead of the summary of that is this :

    var mydate = new Date () var year = mydate.getYear () if (year <1000) year + = 1900 var day = mydate.getDay () var month = mydate.getMonth () var Dayma mydate.getDate = () if (Dayma

    Can solve this little problem we would do a great favor!
    Thanks
    http://www.deafmlm.blogspot.com

  39. Pingback: Sexy Share Social Bookmarking Widget
  40. Many thanks for port this from wordpress to bloger 🙂

    Also vist my website and use sexy bookmarks 🙂

Leave a Reply