Cara Mudah Memasang Fanspage Facebook Melayang Pada Blog Admin : Unknown

Setelah Posting Tutorial Blog  soal Cara Memasang Kotak Komentar Facebook,kali ini saya ingin  berbagi Cara Memasang Fanspage/Halaman Facebook Melayang Pada Blog. Sebelumnya mari kita bahas apa keuntungan dan kerugiannya,
Yang pertama keuntungannya,yaitu dengan pasang Fanspage/Halaman Facebook Melayang halaman kita lebih mudah atau lebih cepat mendapatkan LIKE,ya kan..
Yang kedua kerugiannya,ini mungkin tidak terlalu beresiko,ya itung-itung melatih kesabaran pengunjung,kenapa demikian??? karena setiap kali pindah atau ganti posting kotak fanspage akan selalu muncul,dan pengunjung diharuskan meLIKE atau selalu mengeclouse terus kotak tersebut,g berat cuman kurang nyaman aja mungkin..

Baiklah sebelum kita diterapkan ada kalanya sobat buat halaman facebook dulu kalau belum punya, Kalau sudah mari kita simak tutornya:

1. Log in dulu keblog,dah pasti itu.
2. Pilih Tata Letak

3. Tambah Gadget,maka akan muncul kotak seperti dibawah ini:

4. Pilih HTML/Javascript

5. Copas kode CCS berikut:

<!-- 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;">Join disini dulu ya,<blink> Like This !!!</blink> </p>
<!-- Mulai --!>

<div class="fb-like-box" data-href="https://www.facebook.com/catatansaif" data-width="250" data-height="400" data-colorscheme="light" data-show-faces="true" data-header="true" data-stream="false" data-show-border="true"></div>
 <!-- Selesai --!><a class='close' href='#'>&times;</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://catatansaif.blogspot.com/">Berbagi Ilmu Sipil</a> and <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" http://catatansaif.blogspot.com/search/label/Tutorial%20Blogger">Tutorial Blogging</a></p></div>

6. Selesai dan simpan.

Catatan: Kode warna merah,adalah kode script fanspage facebook,sobat cukup ganti kode warna hijaunya saja dengan nama fanspage sobat.

Demikian Cara Memasang Kotak Fanspage Facebook Melayang dari saya, apabila ada kritik dan saran silahkan berkomentar ya... terima kasih semoga bermanfaat..

Baca juga tutorial blogging berikut :

• Cara mematikan fungsi klik kanan pada blog
• Cara mudah memasang kotak komentar facebook diblog
• Cara membuat bingkai foto pada blog

Baca Artikel Kisah-kisah Hidayah :

• Bertaubat setelah menyaksikan sakaratul maut
• Perjalanan seorang atheis mencari agama yang haq
• Taubatnya seorang gadis punk dibulan ramadhan