Malam saya share Cara Membuat Like Box Facebook Melayang yang menurut saya cukup menarik untuk blog sobat ( Blog saya juga memakai widget yang satu ini ). Widget ini cukup menghemat tempat karena lokasinya disembunyikan di sebelah kanan blog dan otomatis akan keluar jika mouse diarahkan ke icon Facebook.
Berikut cara memakainya :
- Login ke Blogger
- Pilih Rancangan > Add Gadget > HTML/JavaScript
- Lalu masukan code ini :
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
/*<![CDATA[*/
jQuery(document).ready(function() {jQuery(".likebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);});
/*]]>*/
</script>
<style type="text/css">
.likebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVKkmVg5lZWx9Qpifq78aWWaCzJ81ejHArcWYHd8CRyg8bn3jHOc6kogyj3Mr0t7TES8-qrvPR7jMV2_t4AqCAYNjIjXAwkArhUhwfymj59vX5xrpsnWddhaEo1-T4PqC_lk4Mo8b4oYnp/s1600/fb.png") no-repeat scroll left top transparent !important;display: block;float: right;height: 290px;padding: 0 5px 0 45px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:40%;}
.likebox div{border:none;position:relative;display:block;}
.likebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 7px;text-align: right;z-index: 99999;}
.likebox span a{color: gray;text-decoration:none;}
.likebox span a:hover{text-decoration:underline;}
</style>
<div class="likebox" style="">
<div>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/HGC-Syndicate/368458416551705&width=260&height=290&colorscheme=light&show_faces=true&border_color&stream=false&header=true&appId=224281724287326" scrolling="no" frameborder="0" style="border:black; overflow:hidden; width:245px; height:290px;background:white;"></iframe><span><b><a target="_blank" href="http://www.hgc-syndicate.com/2012/05/cara-membuat-like-facebook-melayang.html">Get Widget</a></b></span>
</div>
</div>
- Lalu Simpan
Note : Tulisan berwarna merah ganti dengan URL Page anda
Semoga Bermanfaat ^_^
