KeyzeX – Widget pada Blog bukanlah hal yang aneh lagi , dikarenakan Widget yang terpasang pada sebuah blog memiliki tujuan tertentu yang bermanfaat dan mempercantik suatu blog. Sebelumnya , mengenai Memasang Fans Page Facebook pada Blog. Untuk tutorial kali ini sama saja dengan memasang Fans Page pada Blog TETAPI ada hal yang membedakannya yaitu tutorial yang akan saya berikan adalah Melayang. Melayang? Seperti apakah melayang Fans Page Facebook pada blog ? Berikut adalah contoh atau gambar Widget Like Box Facebook Melayang .
- Agar bertambahnya Like pada Fans Page kita , sehingga Fans Page kita dapat di kelola dengan baik.
- Sudah di lengkapi dengan Tombol Close , sehingga tidak menganggu Khalayak yang sedang membaca suatu Postingan yang terdapat pada blog kita.
- Dapat mengganggu pengunjung atau khalayak tetapi sudah di lengkapi dengan tombol Close maka khalayak tidak akan merasa terganggu dengan Like Box Melayang ini,
- Agan harus mempunyai sebuah Fans Page , jika tidak punya bisa baca disini >Memasang Fans Page Facebook pada Blog.
- Login terlebih dahulu pada Blogger yang sobat kelola.
- Pada bagian Menu Utama Blogger / Dasbor , Masuk ke Tata Letak dan Tambah Gadget dan lalu pilih HTML/JavaScript dan klik tanda +.
- Copy dan Paste Script Widget di bawah ini untuk mengisi kolom Konten dan Judul dikosongkan saja
<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;”>@Join Facebook<blink> Like Like Like</blink> </p>
<!– Mulai –!>
<div class=”fb-like-box” data-href=”https://www.facebook.com/KeyzeXblog” data-width=”292″ data-show-faces=”true” data-stream=”false” data-show-border=”true” data-header=”true”></div>
<!– Selesai –!><a class=’close’ href=’#’>×</a>
<p style=” float:right; margin-right:35px; font-size:10px;” >Powered By <a style=” font-size:10px; color:#3B78CD; text-decoration:none;” href=”http://keyzex.blogspot.com/”>Blogger Widget</a> and <a style=” font-size:10px; color:#3B78CD; text-decoration:none;” href=”http://keyzex.blogspot.com/2015/12/cara-memasang-widget-like-box-facebook.html”>Get This Widget</a></p>
</div>
- Simpan Widget tadi , dan Lihat hasilnya.
- Tulisan yang berwarna MERAH adalah Script KeyzeX dan di ganti dengan Script Fans Page agan.
- Jika gagal terus coba lagi , dan jika tetap gagal maka silahkan Contact admin Fanspage. Dan jangan lupa Fanspage KeyzeX di LIKE.