1. Sign in to Blogger dashboard, go to Layout>Edit HTML , tick mark on expand widget template
2. Copy these code below
<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;
padding-top:20px;
}
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://img509.imageshack.us/img509/3131/sexysprite.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. Paste below this code
]]></b:skin>
4. Find these code
<data:post.body/>
5. Copy these code and paste below <data:post.body/>
<div class='sexy-bookmarks'>
<ul class='socials'>
<li class='sexy-delicious'><a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-digg'><a expr:href='" http://digg.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-technorati'><a expr:href='" http://technorati.com/faves?add=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-reddit'><a expr:href='" http://www.reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-stumble'><a expr:href='" http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-designfloat'><a expr:href='"http://www.designfloat.com/submit.php?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-facebook'><a expr:href='" http://www.facebook.com/sharer.php?u=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-twitter'><a expr:href='" http://twitthis.com/twit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-furl'><a expr:href='" http://www.furl.net/storeIt.jsp?u=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-syndicate'><a href='http://feeds2.feedburner.com/YOUR-FEEDBURNER-ID' title='Subscribe to RSS'/></li>
<li class='sexy-email'><a expr:href='" mailto:?subject=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
</ul>
<span class='sexy-rightside'/></div>
You can adjust its width to your main post width size.
6. Save
Note :
- Actually you can put it anywhere as long as still on post section. You also can paste it under
<div class='post-footer-line post-footer-line-1'>
- If your template using automatic readmore, paste that code after <b:if cond='data:blog.pageType == "item"'><data:post.body/>
- You can change background "Sharing is Sexy" using your own image
replace this URL to your own
background:url('http://i43.tinypic.com/2ueii3t.png') no-repeat left bottom;
Important update:
hi all.. please hosted button image to your own hosting...
open this link
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3pu8_HNaV2auue_VJDrVCAnqbz3_qthEzvRHEmV3hbQFaOGDfw1jQFPo5IRe4YlquCs2F6PiY9dFsXE6Eb7HHspPX67xBmhdjgOnu_ElgskSR-7fplRviGJIW-4QGIDwnEZsUiSfnxsM/s1600/sprite.png
save the image
upload to your own imagehosting
replace
http://img509.imageshack.us/img509/3131/sexysprite.png
to your own image URL
Imageshack only provide a little free imagehosting, so please host it self
Credit to Naeem Noor
Hebat mas ! baru tadi saya ngusulin udah ada ..
ReplyDeleteThanks for share ....
ReplyDelete@7gadget: sudah berhasil memasang kan? iconnya kl dirasa kebanyakan bisa di delete kok, saya juga cuman make beberapa hehe
ReplyDeletekalau ada pertanyaan lagi, komen aja ya...biar nanti bisa saya posting..hehehe jadi bahan posting
ReplyDeleteSIP...!
ReplyDeletewow nice bro/sist.. look so animated..
ReplyDelete"kalau ada pertanyaan lagi, komen aja ya...biar nanti bisa saya posting..hehehe jadi bahan posting" « greats
@denny: ndak yakin ye kok bro/sist :P
ReplyDeleteemang meragukan kali bong... wkwkkwkw
ReplyDeleteHheu, masih aja dipanggil mas :p
ReplyDeletewow! your timing is perfect..yesterday i'm looking for this...N 2day i get it...thanx
ReplyDeletethanks your tips....
ReplyDeleteTriknya luar biasa! sudah pantas diberi gelar master Blogger!
ReplyDeleteawesome sob, simple and fresh...
ReplyDeleteklo misal make addthis.com ntu giman sih?
ReplyDelete@vern:tinggal copy kode HTML nya aja..
ReplyDeletethanks my blog have sexy bookmarks now.
ReplyDeleteI put the code after the code who appears in the footer of the post!
@jeff:great customization jeff
ReplyDeletebeautiful
ReplyDeletehttp://joomlink.blogspot.com
It worked on my both blogs.Now depending on what template someone use the codes work like this:on some templtes works below this code data:post.body/ and on some below this code div class='post-footer-line post-footer-line-1' like on my two blogs.But it works and thanks for sharring.
ReplyDelete@cocut: yess, you can put it everywhere, as long as on your post section
ReplyDeletethis is not working on my Blog
ReplyDeletehttp://believe-or-not.blogspot.com
Ipiet you are amazing! I'm so excited, I love it, thank you.
ReplyDelete@melani:hi mel, thanks so much
ReplyDelete@salman:try it before say not working
Hiya, how can you remove some of the icons and keep the spacing aligned? Also, for some reason some of my icons are in strange spaces on my page, www.mellymelsthemes.com, it interrupts some posts, wondering if there is something I need to adjust?
ReplyDeleteHi! How do you make it say 'sharing is caring' instead of sharing is sexy?
ReplyDeleteYour tutorial is great it works perfectly!
hi delane
ReplyDeleteyou should create it background
here's image URL my 'sharing is caring'
http://2.bp.blogspot.com/_sunpK_FtO1E/SmLCe4iu0zI/AAAAAAAAAIg/ZXGCNjtZby0/s1600/sharing.png
change these background url , to that 'sharing is caring' URL
div.sexy-bookmarks {
height:54px;
background:url('http://i43.tinypic.com/2ueii3t.png') no-repeat left bottom;
position:relative;
width:540px;
padding-top:20px;
}
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;
}
hi melanie
ReplyDeletejust delete it and it will be adjusted automatically
remember
div.sexy-bookmarks {
height:54px;
background:url('http://i43.tinypic.com/2ueii3t.png') no-repeat left bottom;
position:relative;
width:540px;
padding-top:20px;
}
adjust its width to your post width size
so thanx., very nice...
ReplyDeletethanks you very much. see what i have done with your tutorial here http://my-naruto-blog.blogspot.com/
ReplyDelete(",)
thannks but the image is not displaying properly . please help me out
ReplyDeletembak kalo naruh iklan di bawah posting (dgn automatic readmore bagaimana caranya?)
ReplyDeletebisa juga aku (trial and error) naruh script iklan di bawah <p><data:post.body/></p>
ReplyDeleteThis is a huge upgrade for me and http://barfryguy.com Bless you dude.
ReplyDeleteI used your codes. really its working but you can tell me how i can use these codes on wordpress free blog?
ReplyDeleteI have ever seen this in wordpress blog...maybe you could search it, or just adjust HTML code to php code.. im sorry not really know about php
ReplyDeleteNice.. added to blog @ http://www.8774e4voip.com
ReplyDeleteThanks
MW
bong... need your help. :(
ReplyDeleteaku dah pasang, tapi ko ga muncul ya? tadinya aku pake punya-e allblogtools, trus aku ganti... eh, malah sekarang ga muncul juga yang punya cahaya biru ini, :D
apa yang salah tuh bong? liat di blogku yang ini ya... :)
udah bisa bong.... :D
ReplyDeletetararengkyu. :)
bong.... hehe... one more, minta code widget yang, "share and subscribe" dumz... ;;)
ReplyDeleteboleh yak. hehe..
dear, thanks for the sharing.Fun-tastic job!
ReplyDeletemy icons are not aligning properly after deleting some.. there are gaps in between is there a way to get rid of the gaps?
ReplyDeletehey I have the same issue as you blog is having right now. As I see your template is from btemplates as well.. all your social media icons disappeared.. any suggestions?
ReplyDeleteI have the same problem of alenchick... what can we do?
ReplyDelete@alenchik: which one? my social media appear normally.
ReplyDeletethe pic doesnt show up anymore, is there a prob with the image hosting?
ReplyDeletetry to save from this url
ReplyDeletehttp://img509.imageshack.us/img509/3131/sexysprite.png
could you?
That still doesn't work...maybe I'm not putting in it the right place?
ReplyDeleteCebong, it gives an imageshack error, go and see the picture in the link you posted in your comment!
ReplyDeletemaybe its bandwidth is exceeded..
ReplyDelete@loren: save from http://img509.imageshack.us/img509/3131/sexysprite.png
ReplyDeleteupload it to your own image hosting, such as photobucket. pick image URL and replace http://img509.imageshack.us/img509/3131/sexysprite.png on Edit HTML with your URL from photobucket
but if i go to: http://img509.imageshack.us/img509/3131/sexysprite.png
ReplyDeletewith my browsers, i don't see a picture, just the imageshak error!
i can't see my icons on blog=(
ReplyDeletewhy?
hi all.. please hosted to your own hosting...
ReplyDeleteopen this link
http://2.bp.blogspot.com/_ZndXpD4mctI/Svrk3WhMv3I/AAAAAAAAA-Y/Dn-mpBB2fVc/s1600/sprite.png
save the image
upload to your own imagehosting
replace
http://img509.imageshack.us/img509/3131/sexysprite.png
to your own image URL
Imageshack only provide a little free imagehosting, so please host it self
i upload image http://2.bp.blogspot.com/_ZndXpD4mctI/Svrk3WhMv3I/AAAAAAAAA-Y/Dn-mpBB2fVc/s1600/sprite.png
ReplyDeleteto http://photobucket.com/ and now all working=)
thanks a lot for this great thing!
i've added that icon but it was too long until it exceeded the blog post border.
ReplyDeletethat icons are exceeded my blog width, i tried to adjust it but it covered up my sharing is caring qoutes....can you help me???
ReplyDeletejust delete some that you dont need...
ReplyDeletembok yen ngomong jo nggo bhs inggris to.. q mumet tenank ki...
ReplyDeletekeren banget boss... dah lama nih ane nyari yg bgnian.. eh akhirnya nmu jga... he..he..
ReplyDeletemakasih banyak ya boss tutorialnya...
" T O P " bgt deh...
inget waktu kamu nyari-nyari tutorial ini...salam bong!
ReplyDeleteno.5 doesnt have myspace code!help!
ReplyDeleteDear Admin, many many thanks for all the help. I have a small problem that is i dont want to show the bookmark button on my homepage instead i want to show them is the details page i.e individual posting page. Exactly as you have. My blog is sareez.blogspot.com
ReplyDeleteHi, for some reason all my images are now gone, after using this plug-in for few months...
ReplyDeleteany ideas?
The Mobile Spoon
read an update
ReplyDeleteYay finally it works again! Thanks alot!! xoxox
ReplyDeletenice inpoh n thx 4 sharing...
ReplyDeletepleaze visit my blog at Hendra Site
Right I got it. Thanks.
ReplyDeleteit finally works! XD
ReplyDeletehatur nuhun.. ^0^
The pictures of the buttons aren't showing up. I hosted my own images, but all I see is "Sharing is sexy" not the icons...http://thingsilearnedfromwork.blogspot.com/
ReplyDeleteFor the poster above - the buttons aren't showing because you have to host the image yourself. Go below the original post and it's been updated to show you where to get the pic and how to host it yourself.
ReplyDeleteIt works great although I need to resize it and I'm kinda scared to do it!
Hi thanks a lot. Now I am able to put all the socializing icons on my blog.
ReplyDeleteGreat help :)
Wah...mantaaaaabbbbb...
ReplyDeletetapi aku pasang di blog aku...
eh...yang keluar backgroundnya doank..
http://semarkaton.blogspot.com
but...tetep top markotop!!
One accessory that many pandora beads women consider a necessity is a handbag. In fact there is such a demand for pandora bracelet ladies handbags in the marketplace that the selection just constantly pandora bracelets ebay increases. As each new season begins there are pandora bracelets uk dozens of new designs of ladies handbags available. pandora charm bracelet Every woman has her own sense of style and therefore she’ll tend to purchase ladies pandora charms handbags that reflect that. For some women they only buy designer ladies handbags. pandora charms bracelets These particular types of ladies handbags are crafted from the finest materials and pandora jewellery carry the names of some of the most celebrated designers in the world. Designer pandora jewelry ladies handbags are very expensive but many women view them as a fashion pandora uk investment.
ReplyDeleteAwesome Thanks so much, it works perfectly and easy!
ReplyDeleteI do have one question though, how can I change order of the Buttons?
Deleting some is easy but I didn't get behind rearranging.
Hope the question is not stupid! Thanks so much for your help!! :)
@mrs vanquish: you can't because this is an image :) you should create ur own image
ReplyDeletekan bagus di tulis dalam bahasa melayu atau indonesia..
ReplyDeletega bisa T.T
ReplyDeletehelp me please >>> http://bellaabell.blogspot.com/
Really very useful, thanks for sharing.
ReplyDeleteThank you for writing about useful review. It is required to know that mobile apps development could help in your industry by installing customized software applications. Also you may turn your attention on outsourced microsoft .Net development.
ReplyDeleteHey Wow!
ReplyDeleteThat's a great share about adding social bookmarking icon in blogpost.
That is great posts. Let me mention about home insurance rates for USA policy owners homeowners insurance providers. Save on online free quotes on homeowners insurance. Compare home insurance by zip code from top home protection poviders.
ReplyDeleteThank you for writing this great posts. You have nice chance to clarify casino affiliates. The best gaming programs such as affiliates united partners and great poker rooms such as party poker affiliate.
ReplyDeleteWe're glad to know more and read this great review. I'm happy to share with insurance instant that is supported by common insurers. You may save on quotes on homeowners insurance which allow customers to get affordable cheap policy.
ReplyDeleteI put the code after the code who appears in the footer of the post!
ReplyDeleteCoach outlet online Leading American designer and maker of luxury lifestyle handbags and accessories.Large market in Europe and Canada,UK,USA etc.Welcome to Order!2011 New Style arrive,Free Shipping!
ReplyDeletekok gak ngerti maksudnya...
ReplyDeleteyang
4. Find these code