Cara Menambahkan Fanpage Facebook Di Blog

Digital Hamireland | Cara Menambahkan Fanpage Facebook Di Blog - Pada kesempatan kali ini saya akan berbagi tutorial cara menambahkan fanpage FB (facebook) di website atau blog. Namun kali ini saya akan menambahkan fanpage facebook menjadi melayang di blog agar orang lain bisa menyukai suatu halaman atau fanpage kita dengan cepat, tapi agak sedikit risih dipadang orang lain. Kita pasti pernah melihat kotak facebook melayang di blog, pasti kita sudah pernah melihat bukan? Di blog ini pun saya memasang kotak like fanspage dibawah nya, dan bisa dilihat ketika membuka halaman beranda situs ini, kotak nya melayang sendiri dari atas ke bawah loh . . .
Oke , sekarang langsung saja ke tutorial-nya mari kita simak dengan baik.

Cara Menambahkan Fanpage Facebook Di Blog

• Pertama, kalian buka  Dashboard Blog atau Website
• Kedua, pilih Tata Letak
• Ketiga, langsung klik HTML/Java Script
• Keempat, kemudian pastekan Kode Script di bawah ini 

<style type='text/css'>
/* Message Box */
#box-message {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#fff;
font:normal Dosis, Georgia, Serif;
color:#111;
border:2px solid #333;
-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;
}
#box-message a.close {
position:absolute;
top:-10px;
right:-10px;
background:#fff;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#111;
border:2px solid #333;
-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:22px;
-moz-border-radius:22px;
border-radius:22px;
cursor:pointer;
}
#twitterx {
background: #EEF9FD;
padding: 10px;
text-align:center;
border: 1px solid #C7DBE2;
border-top: 0;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type='text/javascript'>
$(window).bind("load", function() {
// Animate Top Value When Page Loaded Completed
$('#box-message').animate({top:"50px"}, 1000);
// Remove Mailbox When Close Button On Click
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='box-message'>
<!-- HTML Start -->  <iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/tikuskaratan/?ref=hl&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=false&amp;appId=371524026202784" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>

<!-- HTML End -->

<a class='close' href='#'>&times;</a></div>

• Kelima, silahkan ganti URL https://www.facebook.com/tikuskaratan/ dengan URL Fanpage kalian.
• Keenam, selesai dan langsung check hasilnya.

Contoh seperti saya : 

Cukup sekian dari saya semoga dengan adanya tutorial ini kalian mengerti dan semoga website ini bermanfaat untuk kalian semua , Terima Kasih ^0^