Membuat Kotak Facebook Like Melayang dengan Tombol Close

Sobat blog trik dan tips, sebelumnya saya telah mengajarkan bagaimana untuk membuat efek slide facebook page fan like di blog. Pada kesempatan ini kita akan membuat hal yang sama namun bukan dengan efek slide tetapi menggunakan efek melayang. Kotak facebook page fan like akan muncul dan melayang pada blog di posisi yang tetap. Kotak Facebook Like akan mengikuti ke bawah atau ke atas apabila halaman di scroll. Kotak ini dilengkapi dengan tombol close untuk menonaktifkan gadjet tersebut. Nah penasaran gimana tampilannya pada blog anda ikuti langkah berikut ini:

1. Log in ke Blogger
2. Masuk ke Design --> Elemen Halaman
3. Tambahkan Gadjet
4. Pilih HTML JavaScript
5. Masukan kode berikut ini dalam gadjet tersebut:

<style type="text/css">
#topbar{
position:absolute;
padding-left:-100px;
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">
<div style="text-align: right;">
<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkAK61cEj1rWhQHqwWvuEwLrltpc_TJ9-Y5yE1Z3xmeTHMNi995_WB4K1ku9-yJK7nj9Dj_YQwxcXwSuL8JhbAOPsZVgCjvYZ97zNOlt45aZiq_8KqbI3GYoMHM8bmeUkHdXJdvIfc-64u/s1600/close3.png" /></a></div>
<center>
<div style="background: #fff;">

PASTE KODE LIKE BOX DISINI

<span >Widget by: <a style=" font-weight:bold" href="http://blogtrikdantips.blogspot.com/">Indra</a></span>
</div>
</center>
</div>

6. Ganti kode yang berwarna merah dengan kode like box facebook fan milik anda, untuk membuatnya sobat dapat lihat DISINI
7. Simpan template anda lalu lihat hasilnya

Gimana mudah saja kan untuk membuatnya. Cobalah buat di blog anda, yang pasti fan page ada pada facebook akan semakin bertambah penggemarnya. Selain itu trafik blog anda akan semakin meningkat. Oke sekian dulu trik dan tips kali ini. Selamat mencoba.. Baca Juga : Anekahosting.com web hosting murah terbaik di indonesia
Baca Juga : Exploit Joomla - Remote Shell Upload Vulnerability [ com_fabrik ]
Baca Juga : Proxy Tercepat Di Indonesia

Title Post: Membuat Kotak Facebook Like Melayang dengan Tombol Close
Rating: 100% based on 99998 ratings. 5 user reviews.
Author: Avia
Terimakasih sudah berkunjung di blog CyberAsk, Jika ada kritik dan saran silahkan tinggalkan komentar

Artikel Menarik Lainya :