Cara Mudah Memasang Like Box FB Melayang di Tepi Blog Blogger

Selamat datang di Syam’s Blog

. 

Jumpa lagi di  Syam’s Blog  pada kesempatan kali ini saya akan berbagi sebuah tips mudah memasang like box FB di blog. 

Setelah sebelumnya saya juga telah memberikan tips memasang like box fb yang berada di sebelah postingan  tips kali ini tidak jauh berbeda, hanya saja like box kali ini menempel di tepi blog. Silakan simak langkah-langkahnya berikut ini:

1. Anda harus memiliki fan page facebook terlebih dahulu.

   Cara Membuat Fan Page Facebook 

2. login ke blogger. 

 Cara Mudah Membuat Blog Blogger 

3. Pilih template

4. klik Edit HTML

5. Cari kode </head>  dengan menekan tombol Ctrl+F.

6. Letakkan kode berikut tepat di atas </head>

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

Catatan : 

Jika sudah ada jQuery seperti diatas (versi berapapun), lewati  langkah ini.

7.Simpan template

8. Kemudian klik Tata Letak

9. Klik tambah gadget.

10. Pilih HTML/JavaScript

11. Masukkan kode berikut 

  

 
<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("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYbaYYZNV9KRg3zGpR8phy3QzP8n7_D6fcaPDjSKDsJtVnrm09q02wgkAMSCzLuD6SowTk9-IAGQQ6oOtLOkE2zxUtrOlqBx-MotIUfbs41qrf-KCv0rt600_795mZgkjFxc6DJ8By6qKf/s150/w2b_facebookbadge.pn") 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%3A%2F%2Ffacebook.com%2FSyam'sBlog&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp; connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe></div></div>

Catatan :

Right = Posisi melayang widget di tepi blog (Right : Kanan & Left : Kiri) sesuaikan dengan kebutuhan anda.

Syam'sBlog = Ganti dengan nama facebook fan page anda

selamat mencoba, semoga bermanfaat

Baca :

Cara Mudah Memasang Iklan di Atas Blog Blogger 

Download Template Super SEO Friendly Blogger

share this article to: Facebook Twitter Google+ Linkedin Technorati Digg

Posted by Syamsuri, Published at 1:09 PM and have