Widget Like Box Facebook Melayang di Blog
Langkah awal yang anda harus perhatikan syarat utama untuk membuat widget like facebook adalah anda sudah harus Memiliki Sebuah Halaman Facebook. Bila belum ada, silahkan buat dulu.
Setelah anda memiliki sebuah halaman facebook, ikuti langkah selanjutnya.
1. Buka Akun Blog yang sobat kelola.
2.Pada Dasbor Blog sobat, masuklah ke Elemen Tata Letak, pilih Add Widget / Tambah Gadget
3. Lalu pilih HTML/Jawascript
4. Selanjutnya copylah kode script di bawah ini ke dalam Widget/Gadget Baru yang sobat buat.
6. end lihat hasilnya.
Perlu diperhatikan :
Setelah anda memiliki sebuah halaman facebook, ikuti langkah selanjutnya.
1. Buka Akun Blog yang sobat kelola.
2.Pada Dasbor Blog sobat, masuklah ke Elemen Tata Letak, pilih Add Widget / Tambah Gadget
3. Lalu pilih HTML/Jawascript
4. Selanjutnya copylah kode script di bawah ini ke dalam Widget/Gadget Baru yang sobat buat.
<!-- FB melayang tombol close --!>5. SAVE/Simpan Widget/Gadget Baru yang sobat buat tersebut.
<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/NAMA HALAMAN FB ANDA" data-width="292" data-show-faces="true" data-stream="false" data-show-border="true" data-header="true"></div>
<!-- Selesai --!><a class='close' href='#'>×</a>
</div>
6. end lihat hasilnya.
Perlu diperhatikan :
- Tulisan berwarna Merah adalah Kode Script dari Halaman Facebook ANDA Silahkan sobat ganti code script tersebut dengan Kode Script dari Halaman Facebook sobat.
- Bila tidak berhasil, coba ulang dari awal.