Tutorial Mudah Cara Membuat Like Box Facebook Melayang di Blog

Tutorial Mudah Cara Membuat Like Box Facebook Melayang di Blog- - -Like box atau fan page adalah hal yang wajib dimiliki untuk menambah penggembar atau pengikut pada blog atau web anda, sebelum kita melangkah cara membuat tutorial like box melayang pada blog, tentu kita harus sudah memiliki fanpage like facebook terlebih dahulu, jika anda belum memiliki fanpage like facebook silahkan lihat Tutorial Cara Mudah Pasang Fan Page Like Facebook Diblog, jika sudah maka langkah selanjutnya adalah Memasang Widget Like Box Facebook Melayang di Blog pengunjung diminta untuk mengklik sebuah kotak apakah dia mau menyukai halaman facebook kita atau tidak (tombol Close).

Berikut ini Tutorial Cara Membuat Like Box Facebook Melayang di Blog :
1. Syarat utama : Memiliki Sebuah Halaman Facebook. Bila belum ada, silahkan buat dulu. Baca disini Cara Membuat Halaman Facebook. Setelah anda memiliki sebuah halaman facebook, ikuti langkah selanjutnya.

2. Buka Akun Blog yang anda kelola.

3. Pada Dasbor Blog anda, masuklah ke Elemen Tata Letak, pilih Add Widget / Tambah Gadget

4. Lalu pilih HTML/Jawascript

5. Selanjutnya copylah kode script di bawah ini ke dalam Widget/Gadget Baru yang anda buat.

6. Simpat Widget/Gadget Baru yang anda buat tersebut dan lihat hasilnya.

<!-- FB melayang tombol close --!>
<style type='text/css'>
#kotak-facebook {
position:fixed !important;
position:absolute; /* IE6 */
bottom:-1000px;
right:40%;
margin:0px 0px 0px -182px;
width:310px;
height:auto;
padding:16px;
-webkit-box-shadow: 0px 0px 7px #222;
-moz-box-shadow: 0px 0px 7px #222;
box-shadow: 0px 0px 7px #222; background-color:#FFFFFF; font:normal 1em Cambria,Georgia,Serif;
color:#111;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
border-top-left-radius: 20px;
border-bottom-right-radius: 20px;}
#kotak-facebook a.close {
position:absolute;
top:-10px;
right:-10px;
background:#333;
font:bold 16px Arial,Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#fff;
border:2px solid #fff;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
cursor:pointer;
}
</style>
<script type='text/javascript'>
$(window).bind("load", function() {
// animasikan nilai top saat halaman telah selesai dimuat
$('#kotak-facebook').animate({bottom:"50px"}, 1000);
// hilangkan kotak pesan saat tombol (x) di klik
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='kotak-facebook'>
<p style=" margin-right:10px; font-size:15px; color:#000000;">Please Bantu Saya,<blink> Like This !!!</blink> </p>
<!-- Mulai --!>

<div class="fb-like-box" data-href="https://www.facebook.com/pages/Fashion-Style-Pria-Wanita/187069001457632" data-width="292" data-show-faces="true" data-stream="false" data-show-border="true" data-header="true"></div>

<!-- Selesai --!><a class='close' href='#'>&times;</a>
<p style=" float:right; margin-right:35px; font-size:10px;" >Pendidikan<a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://eduside.blogspot.com/">Fashion Style</a> and <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://fashionstyle-pria-wanita.blogspot.com/">Get This Widget</a></p>
</div>

*Tulisan berwarna Ini adalah Kode Script dari Halaman Facebook. Silahkan anda ganti Kode Script tersebut dengan Kode Script dari Halaman Facebook Anda.

Demikianlah yang dapat disampaikan Dunia Komputer dan Internet, mengenai Tutorial Mudah Cara Membuat Like Box Facebook Melayang di Blog, semoga dapat bermanfaat dan selamat mencoba semoga sukses.