Memasang Widget Sharing is Sexy

sharingissexy

 

Sebelumnya saya sudah pernah membahas cara memasang widget share facebook di bawah judul postingan. Kurang lebih sama fungsinya, namun kali ini saya akan memberikan sedikit tips buat sobat pemula yang ingin membagi artikelnya lewat situs-situs social bookmark ataupun jejaring sosial, seperti facebook, myspace, twitter, dll.

 

Dengan memasang widget sharing is sexy, maka postingan atau artikel sobat akan cepat tersebar dan otomatis blog sobat akan cepat terkenal di situs-situs social bookmark yang notabennya memang tempat berkumpulnya para blogger di seluruh di dunia. Tapi dengan catatan isi konten menarik, dan sobat wajib mendaftar di berbagai situs social bookmark agar sobat bisa langsung sharing tanpa menunggu pengunjung blog yang mengklik widget sharing is sexy-nya.

 

 

Baiklah mari kita lanjutkan !

  • Silahkan login ke blogger.
  • Kemudian klik tab Edit HTML.
  • Klik Expand Template Widget.
  • Copy kode di bawah ini setelah kode ]]></b:skin> 

<style type='text/css'>

div.sexy-bookmarks { height:54px; background:url(http://lh5.ggpht.com/_7Y9pl24WpQY/TXarM4d7_uI/AAAAAAAAE4c/1SvA_kEmBDQ/sharing_thumb%5B3%5D.png) no-repeat left bottom;position:relative; width:540px }

div.sexy-bookmarks span.sexy-rightside { width:17px; height:54px; background:url(http://lh5.ggpht.com/_7Y9pl24WpQY/TXarM4d7_uI/AAAAAAAAE4c/1SvA_kEmBDQ/sharing_thumb%5B3%5D.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;f ont-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://lh5.ggpht.com/_7Y9pl24WpQY/TXarI2MridI/AAAAAAAAE4U/Qspdg7GUj5g/sexy_thumb%5B3%5D.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>


  • Lalu cari kode <data:post.body/>
  • Jika sobat sudah menggunakan read more, maka akan terdapat 2 kode <data:post.body/>. Letakkan kode dibawah ini setelah kode <data:post.body/> yang pertama

<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'/></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'/></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'/></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'/></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'/></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'/></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'/></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'/></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'/></li>

<li class='sexy-syndicate'><a href='http://feeds2.feedburner.com/miscah' title='Subscribe to RSS'/></li>

<li class='sexy-email'><a expr:href='&quot; mailto:?subject=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>

</ul>

<span class='sexy-rightside'/></div>


Kemudian Simpan Template.

 

Ganti tulisan yang berwarna merah dengan ID feedburner sobat, jika belum punya sobat bisa daftarkan blog sobat langsung di feedburner.

Berlangganan artikel terbaru via Email
Artikel Lainnya :

57 comments

24 Desember 2009 pukul 16.34

Perasaan ada yg ke duanya loh BOS
yg pake script, pas mouse diarahkan ada buanyak ke bawah

24 Desember 2009 pukul 19.34

@ Beben : maksudnya apa ya ben..yg ke duanya yg mana? kode <data:post.body/> kah?

25 Desember 2009 pukul 07.21

@Kang DODDY : bukan tutornya, tapi bookmar sexynya udah ada yg up to date BOS...xixixixi

31 Desember 2009 pukul 10.33

tenk kyou boz...!
Ini yang akuw cari selama ber-abat abat lamanya...!
mau tanya nie bos, kalo' cara meletakkan Kotak Langganan itu gimana caranya bos...!
Plish jawab yya, akuw butuh bangets

jawab di www.blogsuka-suka.co.cc

Aku tunggu...!

31 Desember 2009 pukul 15.19

@ Nabil Muhammad : klo mo buat kotak berlangganan email, sobat kudu ikutan feedburner.com daftar aja dulu tar ada penjelasannya cr meletakkannya

2 Februari 2010 pukul 00.05

mantab sobbbb

14 Februari 2010 pukul 18.59

Makasih Sob!!!

4 April 2010 pukul 17.14

kok di HTML template saya gak ada kode itu ya? -pdhl pngn naroh-, ddoooohh! :(

4 Mei 2010 pukul 10.43

hmmm...artikel bagus mas
jadi pengen nyoba

salam kenal ya

9 Mei 2010 pukul 00.54

Muantab mas boleh nanya mas di blog saya kok komentar nya bisa dobel bagaimana y mas

16 Mei 2010 pukul 23.55

keren kk infonya :)
mauu nanya dunn kalu misalnya d'tambahin button sharenya lg gmn caranya ?
misal d'tambahin button share lintas berita .
thanks :D

17 Mei 2010 pukul 01.56

nanti akan saya bahas cara memasang widget lintas berita biar lebih jelas

20 Mei 2010 pukul 13.25

kok aku gk ada perubahan ya, tolong dong. tolong di bales ke comment blog aku ya

24 Mei 2010 pukul 13.41

kang dody kok di blog ku munculnya di halaman utama?

24 Mei 2010 pukul 22.49

@fachry : coba tambahkan kode berikut

<b:if cond='data:blog.pageType == &quot;item&quot;'>

KODE YANG KE-2 ( setelah <data:post.body/> )

</b:if>

9 Juni 2010 pukul 23.20

keren postingnya, mudah dimengerti..langsung tak praktekkan dan ternyata sukses,,he,he,, trimakasih om Dody...

15 Juni 2010 pukul 02.19

makasih infonya gan.... baru tau ane...maklum blogger pemula

24 Juni 2010 pukul 09.06

tanya nich , punya ku pake auto readmore , link within nya thumbnail marquee , knp qo g muncul ya widget "sharing is sexy" nya ??

http://whatuget.blogspot.com

maklum , baru newbie . . , :D

makasii

wah akhirnya bisa juga thx sob............

1 September 2010 pukul 15.00

thanks gan

11 Oktober 2010 pukul 14.33

Thanks ye....

18 November 2010 pukul 11.22

dicoba dulu deh

23 November 2010 pukul 10.58

wah, widget ini salah satu yang saya cari.

langsung dicoba, ah...!

9 Desember 2010 pukul 01.17

Terima kasih Gan..
Akhirnya bisa juga. Cz kemaren punya saya rusak jadi gak bisa. Sekarang dah normal lagi.. terima kasih..

16 Desember 2010 pukul 01.15

di template saya malah ada 3 , jadi yg mana yg dipakai. masih bingung sob

2 Januari 2011 pukul 03.13

makasih infonya sob, akn saya coba

23 Januari 2011 pukul 11.41

sob....punyaku kok social bookmarknya ada di bawah kotak komentar ya...? Mohon bantuannya!!!

12 Februari 2011 pukul 19.11

mas kok di blog saya cuma muncul di halaman depan aja.. di pos y enggak

12 Februari 2011 pukul 21.04

@Denny Ramdhani Zain : coba tambahkan kode berikut

<b:if cond='data:blog.pageType == &quot;item&quot;'>

KODE YANG KE-2 ( setelah <data:post.body/> )

</b:if>

26 Februari 2011 pukul 09.36

image h0stingnya udah wassalam kang, mohon pencerahan :)

26 Februari 2011 pukul 09.40

mkasih Kang :)

4 Maret 2011 pukul 13.52

makasih mas. mau tnya mas, cara mengatur jarak antara icon yang satu dgn yg lainnya gmna y mas? coz saya pke template 3 kolom jadi hasilnya ada satu icon tdk tampak.. mhon solusinya y mas.

5 Maret 2011 pukul 14.33

saya bisa bos, tapi kok nya ku coba yg pertama tidak bisa padahal aku pakai readmore, dan kocoba aja yang ke kedua bisa

8 Maret 2011 pukul 21.54

Gan mau tanya, cara buat menu collapse gmana caranya........ (maksudnya kaya blog gan, ''POPULAR POST'', 'DOMAIN', ''KODE WARNA''.... Seperti blog mas punya..... jadi collapse menu, (seperti anak tangga, menu POPULAR POST punya anak direktorynya) klo diclik ada menu tambahan dibawahnya + sub menu tambahanny ........ thanks sebelumya.......

12 Maret 2011 pukul 22.46

Thank mas bro tutorialnya :)

30 Maret 2011 pukul 21.19

thank kang udah bisa neeh :)

9 April 2011 pukul 21.02

menghilangkan tulisan menu sharing sexynya gimana mas comen balik ea

22 April 2011 pukul 13.20

thanks ya... ilmunya bermanfaat banget... ^_^

1 Mei 2011 pukul 15.18

ko ga ada mas ?.. padahal uda saya pasang ?..

4 Mei 2011 pukul 12.46

bolehlah ntar kucoba pasang biar tambah menarik. Thx ya

18 Mei 2011 pukul 21.25

Terima Kasih sob ..... !

22 Juni 2011 pukul 15.05

Thanks tutorialnya...
Berhasil... hehe

25 Juni 2011 pukul 10.54

terma kasih bro... widgetnya lansung jadi

14 Juli 2011 pukul 23.12

kalo diganti bookmark lintas berita gmn bos??

23 Juli 2011 pukul 18.49

terima kasih mas.. Infonya, trus skalian minta ijin copy script nya y masterima kasih mas.. Infonya, trus skalian minta ijin copy script nya y mas

11 Agustus 2011 pukul 20.59

Terima kasih Postingannya...
Sangat Bermanfaat Sekali

29 September 2011 pukul 15.59

makasih gan :)

9 Oktober 2011 pukul 20.50

Dicoba di blog ku ni ya.. trims..

27 November 2011 pukul 07.50

Makasi mas infonya, saya berhasil masang :)

3 Januari 2012 pukul 12.15

thnks infonya,,
berguna bgt,,

8 Januari 2012 pukul 11.46

Bagusnya lagi kita dapat cepat terindek oleh google dan gampang ditemukan blog kita dibanding tidak submit ke social bookmark

11 Januari 2012 pukul 21.24

kl widget share-nya seperti punya mas dodi gmana ya?

18 Juli 2012 pukul 05.39

kode nya enggk bisa di prsingkat lgi ya sob, klw gini kan bisa mmberatkan blog,,, mohon dukungan Pulsa Elektrik Murah Semarang...tq

3 Agustus 2012 pukul 10.12

Terimakasih infonya

12 Agustus 2012 pukul 13.58

thx banget infonya, kunjungi blogku jga ya, www.colekinfo.blogspot.com

14 Agustus 2012 pukul 13.41

Mantap gan artikelnya , mau coba buat di blgo aye ah

21 Oktober 2012 pukul 15.01

cara mengetahui FeedBurnernya gmanaaa ???

Posting Komentar

Reader Community

Recent Comments