Social Icons

Pages

Friday 10 August 2012

Membuat Like Box Fans Page Di Blog

 Hay kawan, saya mencoba memberikan tutorial bagaimana cara buat Like Box seperti yang ada di samping Kiri Blog ini, seperti kaleng yang ada huruf F nya itu. .
Caranya sangat mudah, berikut caranya :

1. Login ke blog Anda
2. Lalu masuk dasbor di blog Anda =>> Pilih Tata Letak
3. Klik Tambahkan Gadget 
4. Lalu Pilih HTML/JavaScript
5. Nah Copy Paste kode di bawah ini ke HTML/JavaScript

<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/Kak-Anwari-Berbagi/133750546766643&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=false&amp;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/AVvXsEh3iw1NBOdKmZSgiJwxioFHt7cMa1hOgzjytg_M4NjXHPSIUvtzeZMxqvrySjG1ngFSyMY78pPMj0NANdoyewuHHkGBM4fiwL4hlE3uy9XuLIvdwMJgwsic0h201lfAG9Pet0vPlNidnNVm/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/AVvXsEhp7lM-6-GAtANXtfmGnGgJP_E70pVOBm4Y8JisAMs0tZnOfYbqPK9S5E69PfjN7gy2w7UbJIJK92EcND2adcCIa-GW174MNpT75BEurEgsjuRsEH0AaY9TjyxfieQOKHOOrRqqWgAzXHPa/s128/Drink-Facebook.png"  /></a>
</div>

6. Pada tulisan warna Merah ganti dengan Alamat Fans Page Anda
7. klik save ==>> Nah beres deh di coba buka deh. .

Salam Suksess Mas N Mbak Bro, hahah

No comments:

Post a Comment