Cara Membuat Like Box Facebook Melayang Pada Blogger

Widget like facebook dengan posisi melayang dengan tombol close memang mempunyai keuntungan tersendiri buat para blogger. Kenapa? karena widget ini bisa menghemat tempat dan juga bisa cepat dilihat oleh pengunjung blog. 

Cara Membuat Like Box Facebook Melayang Pada Blog

Cara Pemasangan Pada Blog

Pemasangan widget kotak like melayang tidak harus mengedit HTML/CSS template blog,  tetapi cukup dengan membuat gadget baru dan mamasukkan kode script ke dalamnya. Untuk lebih jelasnya, perhatikan tutorial berikut.
  • Login ke blogger
  • Pilih Tata Letak > Tambah Gadget > HTML/Javascript
  • Copy dan pastekan kode di bawah ini dan masukkan kedalam gadget yang sobat buat tadi
<style type="text/css">
#topbar{position:absolute; padding-left:350px;padding-top:200px;background-color:transparancy;width: 300px;visibility: hidden;z-index: 100;}
</style>
<script type="text/javascript">
var persistclose=0,startX=30,startY=5,verticalpos="fromtop";function iecompattest(){return document.compatMode&&"BackCompat"!=document.compatMode?document.documentElement:document.body}function get_cookie(b){var b=b+"=",c="";0<document.cookie.length&&(offset=document.cookie.indexOf(b),-1!=offset&&(offset+=b.length,end=document.cookie.indexOf(";",offset),-1==end&&(end=document.cookie.length),c=unescape(document.cookie.substring(offset,end))));return c} function closebar(){persistclose&&(document.cookie="remainclosed=1");document.getElementById("topbar").style.visibility="hidden"} function staticbar(){barheight=document.getElementById("topbar").offsetHeight;var b=-1!=navigator.appName.indexOf("Netscape")||window.opera,c=document;window.stayTopLeft=function(){if("fromtop"==verticalpos){var a=b?pageYOffset:iecompattest().scrollTop;ftlObj.y+=(a+startY-ftlObj.y)/8}else a=b?pageYOffset+innerHeight-barheight:iecompattest().scrollTop+iecompattest().clientHeight-barheight,ftlObj.y+=(a-startY-ftlObj.y)/8;ftlObj.sP(ftlObj.x,ftlObj.y);setTimeout("stayTopLeft()",10)};var a=c.getElementById("topbar"); if(!persistclose||persistclose&&""==get_cookie("remainclosed"))a.style.visibility="visible";c.layers&&(a.style=a);a.sP=function(a,b){this.style.left=a+"px";this.style.top=b+"px"};a.x=startX;"fromtop"==verticalpos?a.y=startY:(a.y=b?pageYOffset+innerHeight:iecompattest().scrollTop+iecompattest().clientHeight,a.y-=startY);ftlObj=a;stayTopLeft()} window.addEventListener?window.addEventListener("load",staticbar,!1):window.attachEvent?window.attachEvent("onload",staticbar):document.getElementById&&(window.onload=staticbar);
</script>
<br />
<div class="clear">
</div>
<div id="topbar">
<table border="1" bgcolor="#fff">
<tr>
<td>
<div style="text-align: right;">
<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8M61a2gf5btO2fY-3gR8E2JQrGlb3u4qcs8uGQbSZQFz46oT3jzzFEha4eS8MaPg52iIkRY7zEh20Ks3upDJbo1Lim-zjwcDZj_H4YSwP2CmB6LjGUtS8OJ4s-Fx90DmOftqwakxu-m8/s1600/close-1.gif" /></a></div>
<center>
<div style="background: #fff;">

Letakkan kode Like Facebook sobat disini

</div></center></td></tr></table></div>
  • Langkah selanjutnya, pilih simpan dan lihat hasilnya.
Demikain tutorial tentang bagaimana cara membuat like box facebook melayang pada blog kali ini, terima kasih dan salam blogger...!!!

Unknown
Unknown

17 comments:
Write comment
  1. Gan, yg ini baru gampang dipahami!

    ReplyDelete
  2. Dilarang Menyertakan Link Hidup!! Spam tidak diperbolehkan!

    ReplyDelete
  3. manta gan.. work di blog ane.. mantap.. :)

    ReplyDelete
  4. gimana cara dapetin kodenya???

    ReplyDelete
    Replies
    1. Dilarang Menyertakan Link Hidup!! Spam tidak diperbolehkan!

      Delete
  5. Terimakasih atas infonya.

    ReplyDelete
  6. Kode like nya yang kaya mana gan??

    ReplyDelete
    Replies
    1. Dilarang Menyertakan Link Hidup!! Spam tidak diperbolehkan!

      Delete
  7. Keren Mas MAntap...
    kunjung balik ya
    http://vie-sie.blogspot.com/

    ReplyDelete
  8. nanggung tutorny kk

    ReplyDelete
  9. Kenpa Selalu di Samping Kanan ya LIKE box nya ..pliss bantuannya

    ReplyDelete
  10. AnonymousJuly 06, 2013

    thanks iinfonya gan

    ReplyDelete
  11. AnonymousJuly 08, 2013

    thanks gan, works codenya

    ReplyDelete
  12. AnonymousJuly 08, 2013

    makasih gan
    ane coba dan berhasil

    ReplyDelete
  13. Keren gan banyak bgt Uganda ngelelet:):)

    ReplyDelete