Cara membuat Like facebook auto hide pada blog

Advertisement

Ketemu lagi sobat bloger, kali ini saya akan share cara membuat like facebook keluar dari samping blog hanya dengan mengarahkan kursor mouse saja. langsung saja kita menuju ke tutorialnya.

ikuti langkah berikut :

• Login ke akun bloger sobat
• Pilih rancangan dan klik Edit HTML
• Kemudian sobat lanjutkan dengan mencari kode </head> (untuk mempermudah gunakan ctrl+f untuk mencari kode tersebut)
• Kalau sudah ketemu, masukkan kode dibawah ini tepat diatas kode </head> tadi kemudian save

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>

NB. Kalau kode diatas sudah ada, berarti sobat hiraukan saja tahap ini dan lanjutkan ke tahap berikutnya.

• klik tata letak > tambahkan widgets > pilih HTML/Javascript 
• Copy pastekan kode berikut kedalamnya

<script type="text/javascript">

//<!--

$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});

//-->

</script>

<style type="text/css">

.w2bslikebox{background: url("http://3.bp.blogspot.com/-KdSAuv-K7HM/To_WXoWHzJI/AAAAAAAAGvg/5UvL10LUe_k/facebook.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}

.w2bslikebox div{border:none;position:relative;display:block;}

.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}

.w2bslikebox span a{color: #808080;text-decoration:none;}

.w2bslikebox span a:hover{text-decoration:underline;}

</style><div class="w2bslikebox" style=""><div>

<iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/Andum-ilmu/145809408828339?fref=ts&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=330" scrolling="no" frameborder="0" style="border: medium none; overflow: hidden; height: 330px; width: 245px;background:#fff;"></iframe><span><a href="http://caramudahuntukmu.blogspot.com/2013/01/cara-membuat-like-facebook-auto-hide.html">Tutorial Here</a></span></div></div>

• Ganti kode yang berwarna biru dengan alamat fan page facebook sobat

• Dan selesai, kalau sobat mengikuti instruksi dengan benar maka akan terlihat seperti gambar di bawah ini :