Cara Membuat Like Box Facebook melayang ~ Tempat Kursus Komputer di Jogja | Privat Komputer Yogyakarta

Siapa yang tidak tau dengan Facebook???
Yang belum tau, browsing dulu apa itu facebook.
Facebook merupakan media sosial paling populer saat ini.
Adapun langkah untuk menambahkan tombol Like Facebook yang melayang adalah sebagai berikut:
1. Silahkan Login ke Blogger.com
2. Setelah itu Masuk ke Rancangan
3. Pilih elemen laman
4. Pilih Tambah Gadget
5. Pilih HTML/Java Script
6. Copy dan paste-kan Kode Berikut ini: (Gunakan CTRL+C untuk menCopy)

<style type="text/css">
#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:2px solid #999;
background: #ffffff;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:10px;
-moz-box-shadow: 0px 2px 5px 0px #f8f9b9;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="left">
<div style="background:#ffffff;">

<iframe src="//www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/Kursus-Komputer-di-Yogyakarta/228012687268530&width=292&height=258&colorscheme=light&show_faces=true&border_color&stream=false&header=false&appId=371524026202784" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowTransparency="true"></iframe>

</div>
</div>
<div align="right"><a href="javascript:void(0);" onclick="showHideAT()"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh59EpGHRiH45_cxgtxhLSQ6cp9iiQENiTXG6nEPu8GlCG65YvOOqO4ZFF1z9RLodghuIBOFrUSUDwIcYBA-ry8a0ImbtP67IrT0_gzswNrk2USPscvyElbEHVaI-B9JA0ob5K6WnH7-WCC/s128/Close-32.png" alt="close" title="Click here to Close Box" /></a></div>
</div></div>
<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script>
<div style='display:scroll; position:fixed; top:50%; left:0px;'><a href="javascript:void(0);"onclick="showHideAT()"/><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFNp3Zg0CoevU3Yy1YpllRagm3bJF9ZT1zMDPE_bRyL8MfGpxHcUOubMW2gg9Eo6ggcikfUz1ypkoaJnF_I-STBHQL4MvDgOSSw-DJJIPFxOjH6sRdGYhxis5q8YpLQTF9QxMgBOcHCqrZ/s128/Drink-Facebook.png" /></a>
</div>

7. Save. Selesai.

Catatan:
Ganti Text yang berwarna merah dengan Halaman Facebook anda.
Semoga Bermanfaat

Cara Membuat Like Box Facebook melayang

Related Post