Cara memasang ZSC Button

Hai semua :)

Kali ini saya akan share caa membuat ZSC button yang seperti di gambar .

ZSC button ini sangat berguna untuk menambahkan kecanggihan blog kita, merias tampilan blog, serta menghemat ruang pada blog

Di dalam ZSC button ini terdapat 3 Social Network, yaitu Facebook, Twitter dan Google +


Widget ini saya dapatkan ketika saya lagi blogwaking,
Kalau kalian inigin melihat cara bikinnya bisa menuju ke link resminya Inimu

Link: http://inimu.com/widget/zscbutton/share-counters-share-buttons-widget-vertical-zscbutton/

Kalau mau lihat tutor dari saya, silahkan ikuti :)

Langkah-langkah:

1. Buka Dashboard
2. Pilih Template
3. Edit HTML
4. Centang Expand Widget
5. Cari kode <data:post.body/> (kalau ada 2 pilih saja yang pertama)
6. Masukkan kode berikut dibawah kode <data:post.body/> :

<!-- zSCbutton Vertical BEGIN --> <div id="zscbverdiv" style="float:right;"> <div id="zscbvercntr"><ul id="zscbver" style="list-style-type:none;"> <li id="zscbverfb"><script type="text/javascript">(function() { var zlt=unescape('%3C'); var zgt=unescape('%3E'); var zq=unescape('%22'); var zloc=encodeURI(document.location.href); document.write(zlt+'iframe src='+zq+'http://www.facebook.com/plugins/like.php?href='+zloc+'&amp;send=false&amp;layout=box_count&amp;width=45&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=60'+zq+' scrolling='+zq+'no'+zq+' frameborder='+zq+'0'+zq+' style='+zq+'border:none; overflow:hidden; width:45px; height:60px;'+zq+' allowTransparency='+zq+'true'+zq+''+zgt+''+zlt+'/iframe'+zgt); }) ();</script></li> <li id="zscbvertw"><a href="http://twitter.com/share" class="twitter-share-button" rel="nofollow" data-count="vertical">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script><a id="zscbverc" href="http://inimu.com/widget/zscbutton/" title="Share Counter Buttons">i</a></li> <li id="zscbvergg"><g:plusone size="tall"></g:plusone><script type="text/javascript">(function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })();</script></li> <li id="zscbverlb"><script type="text/javascript">lb_skin = 'mode2';</script><script src="http://www.lintasberita.com/widget_vote/lintasberita.js" type="text/javascript"></script></li> </ul><script type="text/javascript" src="http://zscbutton.googlecode.com/svn/trunk/js/zscbutton-ver.js"></script></div> </div> <!-- zSCbutton Vertical END -->

7. Lalu Simpan

Tulisan berwarna MERAH dapat diganti dengan kode berikut:

Penempatan disisi kiri -> float:left;
Penempatan disisi kanan -> float:right;
Melayang diluar kotak -> position:fixed; top:200px; margin-left:-100px;