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 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.
SSIIPP GAN
ReplyDeleteGan, yg ini baru gampang dipahami!
ReplyDeletethank gan atas infonya
ReplyDeletetukar link
manta gan.. work di blog ane.. mantap.. :)
ReplyDeletegimana cara dapetin kodenya???
ReplyDeletePertama : Buka Developers Facebook
DeleteKedua : Masukkan URL fans page facebook kedalam box url yang disediakan.
Ketiga : Atur yang lainnya sesuai keinginan.
Keempat : Klik "Get Code" dan copy kode yang disediakan. Kodenya kurang lebih seperti ini :
<div class="fb-like" data-href="https://www.facebook.com/lostsector.stars" data-send="false" data-layout="button_count" data-width="80" data-show-faces="false"></div>
Jika tidak ingin repot, cukup ganti "lostsector.stars" dengan username facebook kamu.
Terimakasih atas infonya.
ReplyDeleteKode like nya yang kaya mana gan??
ReplyDeletePertama : Buka Developers Facebook
DeleteKedua : Masukkan URL fans page facebook kedalam box url yang disediakan.
Ketiga : Atur yang lainnya sesuai keinginan.
Keempat : Klik "Get Code" dan copy kode yang disediakan. Kodenya kurang lebih seperti ini :
<div class="fb-like" data-href="https://www.facebook.com/lostsector.stars" data-send="false" data-layout="button_count" data-width="80" data-show-faces="false"></div>
Jika tidak ingin repot, cukup ganti "lostsector.stars" dengan username facebook kamu.
Keren Mas MAntap...
ReplyDeletekunjung balik ya
http://vie-sie.blogspot.com/
nanggung tutorny kk
ReplyDeleteKenpa Selalu di Samping Kanan ya LIKE box nya ..pliss bantuannya
ReplyDeletethanks iinfonya gan
ReplyDeletethanks gan
ReplyDeletethanks gan, works codenya
ReplyDeletemakasih gan
ReplyDeleteane coba dan berhasil
Keren gan banyak bgt Uganda ngelelet:):)
ReplyDelete