Menu
» » Cara Membuat Sticky Social Pada Blog

A+ A-
Hai Blogger...
Diartikel kali ini aku mau share Cara Membuat Sticky Social Pada Blog. Sobat Blogger ada yang tahu Sticky Social? Sticky Social ini adalah widget yang serupa dengan social widget yang sering kita lihat diblog2 para blogger. Cuma,Sticky Social ini posisinya tidak vertical melainkan horizontal. kl bisa dibilang seperti stardock di desktop pc.

Nah,Bagi kamu yang tertarik dan ingin memasang Widget Sticky Social ini diblog kamu, ikutin cara - cara dibawah ini:
Cara Membuat Sticky Social Pada Blog:
  • Masuk lah keHalaman Dasbor Sobat, pilih Rancangan (Template) - Edit HTML. Dan jangan lupa diExpand dulu ya. (Sebelum melakukan metode ini diharapkan untuk membackup template sobat sekalian untuk berjaga - jaga. Kalau masih ada yang belum tahu caranya bisa lihat Disini.)
  • Masukkan lah script dibawah. dan letakkan di bawah kode <body>:
<!--stickysocial_dock--> 
<style type='text/css'> 
.stickysocial { 
background: transparent; 
position: fixed; 
top: 35%; 
left: 0.25%; 
z-index: 100; 
vertical-align: bottom; 
width: 37px; 
text-align: center; 
} 
.stickysocial a:hover { 
opacity: .73; 
-moz-opacity: .73;
filter: alpha(opacity=73); 
} 
</style> 
<div class='stickysocial' id='stickysocial_dock'> 
<a href='https://plus.google.com/USERID' target='_blank' title='Follow us on Google+'><img alt='Google+' src='http://i563.photobucket.com/albums/ss76/peace_enes/neon-google.png' style='position:relative; width:37px'/></a>
<a href='http://www.facebook.com/USERNAME' target='_blank' title='Follow us on Facebook'><img alt='Facebook' src='http://i563.photobucket.com/albums/ss76/peace_enes/neon-facebook.png' style='position:relative; width:37px'/></a> 
<a href='http://twitter.com/USERNAME' target='_blank' title='Follow us on Twitter'><img alt='Twitter' src='http://i563.photobucket.com/albums/ss76/peace_enes/neon-twitter.png' style='position:relative; width:37px'/></a> 

 <a href='http://www.myspace.com/USERNAME' target='_blank' title='Follow us on MySpace'><img alt='MySpace' src='http://i563.photobucket.com/albums/ss76/peace_enes/neon-myspace.png' style='position:relative; width:37px'/></a>

 <a href='http://softpcdownloads.blogspot.com/2013/02/cara-membuat-sticky-social-pada-blog.html' target='_blank' title='Get Widget'><img alt='SoftPcDownloads' src='http://i563.photobucket.com/albums/ss76/peace_enes/neon-rss-feed.png' style='position:relative; width:37px'/></a> 

 </div>
  • Ganti Tulisan yang Bewarna Merah dengan nama ID atau UserName Akun Social Sobat Blooger Ubahlah ukuran top dan left-nya sesuai keinginan.
  • Jika sudah selesai, Simpanlah (Save template) dan Lihat lah Hasilnya.
  • Jika kamu menginginkan, kamu juga bisa menambah atau mengurangi icon-icon social network lainnya.
Semoga Artikel ini berguna untuk Sobat Blogger Semua.

Indahnya Berbagi,
Salam Blogger...!!!
Label:
di 00.16.00
 
Top