cara membuat dan memasang Fp like box di blog

Saat saya membuka Blog seseorang, Muncul Sebuah Kotak Like FansPage, saya berpikir bagaiaman ya cara membuat dan memasang ~~Like Box Melayang di Blog~~ , saya browsing sana-sini akhirnya ketemu juga, tapi saat saya lihat , postingan orang tentang Membuat dan Memasang Like Box Melayang di Blog itu tidak menjelaskan bagaimana cara membuat like Box Facebook nya, nah pada kesempatan ini saya akan memberitahukan Membuat Like box fanspage facebook melayang pada blog anda.

Dengan menempelkan Like FansPage di Blog kita, FansPage kita berpotensi mendapat Like dari pengunjung, apalagi dari blog anda yang memiliki pengunjung lebih dari ratusan hingga ribuan, mungkin ada potensi pengunjung melike FansPage kita, dan si pengunjung dapat mengetahui update post blog anda dari FansPage Facebook tersebut. Ya jika anda memasukkan update post di FP anda.

SIMAK BAIK-BAIK KAWAN

Pertama :

1. Anda Klik Situs disamping ini, https://developers.facebook.com/docs/reference/plugins/like-box/
Kemudian, Isikan Kotak-Kotak yang tersedia di situs tersebut

Kolom "Facebook Page URL" diisikan dengan alamat atau URL FansPage Facebook Kalian , misalnya https://www.facebook.com/yudiblogger?ref=hl

Kolom "Width" , isikan dengan Ukuran LEBAR si Kotak Like Box yang akan anda pasang di BLOG, pilih ukuran yang anda sukai , misalkan "292"

Kolom "Height", isikan dengan Tinggi si kotak Like Box yang akan anda pasang di BLOG, pilih ukuran yang anda sukai, misalkan "180"

Kolom "Show Faces", yaitu tempat dimana menampilkan Photo Profil dan FB yang me LIKE FansPage anda, apakah anda ingin menampilkan Orang-orang yang telah me-LIKE FANSPAGE ANDA ??? Jika iya CENTANG , Jika tidak JANGAN CENTANG

Kolom "Color Scheme" , yaitu Warna Like Box anda, mau pilih Warna Cerah ( putih dan abu-abu ) atau gelap ( hitam ), kita ambil contoh , putih alias LIGHT

Kolom "Stream", yaitu apakah anda ingin menampilkan penjelasan tentang Fanspage, postingan terakhir atau lainnya ??? jika iya CENTANG, jika tidak JANGAN DI CENTANG

Kolom "Border Colour" kita lewatkan saja kolom ini

Kolom "Header", yaitu apakah anda ingin menampilkan Judul "TEMUKAN KAMI DI FACEBOOK ATAU FIND US ON FACEBOOK" di kotak LIKE BOX anda ??? jika iya CENTANG , jika tidak JANGAN CENTANG

Jika semua sudah di ISI , maka klik GET CODE

2. Nanti akan Muncul Tab :

HTML5
XFBML
IFRAME <----- PILIH INI
URL

Pilih IFRAME , nanti akan muncul kode seperti dibawah
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fplatform&width=292&height=590&show_faces=true&colorscheme=light&stream=true&border_color&header=true&appId=110888355749331" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:590px;" allowTransparency="true"></iframe>

copy Kode yang mirip seperti itu di Tab IFRAME anda

Sekarang TAHAP PEMASANGAN LIKE BOX di Blog :

Masuk ke blogger, http://blogger.com
Kemudian Klik "BLOG ANDA"
klik TATA LETAK > Tambah Gadget > HTML/JAVASCRIPT

Copy Kode dibawah ini , dan paste kan di Gadget HTML/JAVASCRIPT tersebut
<style type="text/css">
#topbar{
position:absolute;
padding-left:260px;
background-color: transparancy;
width: 300px;
visibility: hidden;
z-index: 100;
}
</style>
<script type="text/javascript">
var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session
var startX = 30 //set x offset of bar in pixels
var startY = 5 //set y offset of bar in pixels
var verticalpos="fromtop" //enter "fromtop" or "frombottom"
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<br />
<div class="clear">
</div>
<div id="topbar">
<table border="1" bgcolor="FFFFFF">
<tr>
<td>
<div style="text-align: right;">
<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEio1lfPi2jYPj1mdnmrmkd_FpModobt76wW5b17lTX8msCPe2U0bcjdE8EGNTQhTiybsNHN39dGtyJQWlZRf0AOat6XoctoCED-D8lH3HaxJjdxuNxw8SrJ1_FABDkjjodErbb6SKXv4CDn/s1600/close3.png" /></a></div>
<center>
<div style="background: #fff;">



PASTEKAN SCRIPT YANG TELAH DI COPY TADI DISINI

</div>
</center></td>
</tr>
</table>
</div>

KETERANGAN : GANTI TULISAN YANG BERWARNA MERAH DIATAS DENGAN KODE LIKE BOX YANG TELAH ANDA COPY SEBELUMNYA DI TAHAP PERTAMA