Cara Memasang Facebook Fanspage di Blog

Sobat-sobat kali ini kami akan memosting tentang bagimana cara menmbahkan fb page kedalam blog Anda, kami tertarik untuk menulis cara ini karena ada dari kalian yang menanyakan cara terbaru ''di forum''

Yang harus pertama kali kita bahas dulu adalah apa itu facebook fanspage, facebook fanspage iyalah halaman khusus layaknya blog yang menyediakan informasi yang beragam sesuai dengan keinginan pemiliknya, mulai dari perusahaan, pendidikan, layanan, produk fisik, artis, komunitas dan masih banyak lainnya. Beberapa orang ahli pun pasti memiliki pengertian fan page facebook sendiri sesuai dengan apa yang mereka pelajari.

Setiap blogger pasti memiliki facebook fanspage sesui konten yang mereka buat, kembali ke pokok pembahasan tentang cara memasang facebook fanspage di blog pernahkah Anda mengunjungi blog yang menampilkan facbeook fanspage di widgate ataupun di bilah layar pada saat Anda mengunjungi blog tersebut

Apakah Anda ingin membuat memasang atau menambhkan facebook fanspage kedalam blog Anda, lantas apakah Anda akan bertanya bagaimana dampak speed loading pada blog saya setelah saya memasang facebook fanspage tersebut ?

Cara yang kami tulis ini sudah kami buktikan dan sudah kami jajal tidak membebani speed loading didalam blog

Cara memasang atau menambahkan facebook fanspage ke dalam blog

Yang harus Anda siapkan pertama kali iyalah kode script facebook fnspage ( page-plugin ), cara mendapatkan kode script facebook fanspage:

1. Login facebook
2. Buka halaman Anda kemudian copy url halaman facebook fanspage
3. Buka alamat url ini : https://developers.facebook.com/docs/plugins/page-plugin
4. Paste alamat url halaman fcebook fanspage kedalam kolom yang sudah disediakan pada nomor 3
5. Sesuaikan tampilan dengan selera Anda
6. Kemudian klik Get Code /dapatkan kode
7. Silhkan copy kodenya

Setelah Anda mendapatkan kode script fb page, sekarang kita memulai menambahkan atau memasang ke blog, disini kita akan mencoba menambahkan facebook fanspage kedua tempat yang berbeda, tempat yang pertam di dalam widgat entah dimana Anda mau meletkkan, dan yang kedua like box facebook fanspage akan muncul di bilah layar tengah pada saat blog Anda di bukak di lengkapi tombol close di pojok kanan atasnya

Cara memasang atau menambahkan facebook fanspage di dalam widgate

Jika Anda ingin menambahkan facebook fanspage di dalam widgate blog Anda entah di bawah di samping atau diatas blog sesuai selera caranya adalah

• Login blogger
• Pilih tata letak
• Tambahkan HTML/javascript
• Copy paste kode script facebook fanspage yang telah kita siapkan tadi
• Kemudian simpan
• SELESAI

Cara memasang facebook fanspage melayang saat blog di buka

Cara yang kedua menambahkan atau memasang facebook fanspage kedalam blog yang melayang-lyang akan muncul saat blog Anda di bukak, dan di lengkapi tombol close di pojok kanan atasnya facebook fanspage tersebut

DEMO : https://lucu-dot.blogspot.co.id/

Untuk demonya silahkan lihat alamat blog diatas silahkan lihat tampilan dekstop dan juga tampilan mobilenya cara membuatnya agak mirip dengan cara pertama tapi kita harus menambhkan kode tambahan untuk tampilan like boxnya

• Login blogger
• Pilih tata letak
• Tambahkan HTML/javascript
• Copy paste kode di bawah
• Kemudian simpan
• SELESAI

Ini kodenya :

<!-- FB melayang tombol close --!>
<style type='text/css'>
#kotak-facebook {
position:fixed !important;
position:absolute; /* IE6 */
bottom:-1000px;
right:6%;
margin:0px 0px 0px -182px;
width:250px;
height:250px;
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;">Sukai halaman,<blink> di facebook ya boy.. !!!</blink> </p>
<!-- Mulai --!>
<div class="fb-page" data-href="https://www.facebook.com/Lucu-dotcom-1934038390250061/" data-tabs="timeline" data-width="250" data-height="150" data-small-header="true" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><blockquote cite="https://www.facebook.com/Lucu-dotcom-1934038390250061/" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/Lucu-dotcom-1934038390250061/">Lucu-dot.com</a></blockquote></div>
<!-- Selesai --!>
<a class='close' href='#'>&times;</a>
</div>

Silahkan kopy paste kode tersebut kedalam cara di atas untuk keterangan kodenya sebagai berikut

Warna merah : silahkan sesuaikan letak like box semakin kecil % semakin kekanan semakin besar % semkin kekiri

Warna biru : sesuaikan ukuran yang Anda inginkan ( sesuaikan juga dengan ukuran kode script (page-plugin ) facebook fanspage yang telah kita buat tadi )

Warna pink : silahkan Anda ganti dengan kata-kata yang lebih menarik menurut Anda

Warna hijau : silahkn Anda ganti dengn kode script ( page-plugin ) facebook fanspage Anda tadi

Naaah setelah Anda mengikuti cara-cara di atas kemudian di simpan berarti Anda sudah berhasil menambahkan atau memasang facebook fanspage kedalam blog, masih kesulitan butuh bantuan silahkan tanyakan di kolom komentar di bawah

Demikian cara memasang facebook fanspage di blog terbru mudah-mudahan bisa membantu.