Cara Membuat FB “LIKE” Box Melayang Pada Blog

Mumpung lagi ada waktu luang ni, aku buatin artikel buat sobat-sobat blogger. Kali ini artikel ku memuat Trik Cara Membuat FP ‘LIKE” Box Melayang dengan Tombol CLOSE seperti yang sobat lihat pada Blog ini.

Gunanya agar pembaca Blog tidak terganggu  adanya Kotak LIKE BOX tersebut. Jika tidak suka, mereka cukup dengan hanya meng-KLIK tombol CLOSE.

Caranya?

Langsung saja sobat tambahkan widget Blog Sobat dan Copy Paste HTML dibawah ini ke widget kosong BLOG sobat.

<!-- Script kotak like Facebook Melayang -->

<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;">Like Dulu Sebelum

<a href="" onclick="closebar(); return false"><img src="http://4.bp.blogspot.com/-t5xkEthSvBg/Us4qdPWAKSI/AAAAAAAAF0w/_mKsGwyvEzQ/s1600/Close.png" /></a> OK !</div>

<center>

<div style="background: #fff;">

<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FsukabuminewsOnline&amp;width=290&amp;height=260&amp;show_faces=true&amp;colorscheme=light&amp;stream=false&amp;border_color&amp;header=true&amp;appId=549294281768408" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:290px; height:260px;" allowtransparency="true">

</iframe>

</div>

</center></td>

</tr>

</table>

</div>

<!-- akhir -->

Ganti Kode Tulisan yang berwarna  MERAH dengan kode FB LIKE sobat.

Naaah, jaadi deh. Selamat Mencoba!