Jika Ada Link Dalam Blog Ini Yang Tidak Berfungsi Atau Broken, Dengan Segala Kerendahan Hati Kami Berharap Pengunjung Sekalian Meng-Infokan Kepada Kami Agar Se-segera Mungkin Kami Memperbaikinya,TERIMA KASIH..!!BLOG ANAK BIMA mengucapkan "SELAMAT HARI RAYA IDUL ADHA 1437H MOHON MAAF LAHIR DAN BATIN" @Admin [by:dyenps]

Sunday, August 12, 2012

Cara Memasang Widget Like Box FB Keren Melayang Di Blog

Hallo Sobat Blogger Sudah Lama gak blogging nih...kangen bangeeeet...(sumpe dech....) oh ya kali ini saya akan membuat tutorial Cara Memasang Widget Like Box FB Keren Di Blog Like Box Facebook ini saya dapatkan saat saya mencari di mesin pencari Google dan sedikit saya rubah.a
Ok....Langsung Aja...!

Klik DEMO


Cara Memasang Widget Like Box FB Keren Di Blog


1. Login Ke Blogger

2. Pilih Tata Letak

3. Klik Tambah Gadget/add gadget

4. Kemudian Pilih HTML/Javascript

5. Masukan Kode/Script Di Bawah Ini:

<!-- Script kotak like Facebook Melayang -->
<style type="text/css">
#topbar{
position:absolute;
padding-left:260px;
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">
<table border="1" bgcolor="FFFFFF">
<tr>
<td>
<div style="text-align: right;">
<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZ3CAtWP57pPzggtb4_HBImu0j4QkqeRQCDQzg8LS6HzvqJziQL7vlINzRuaO1ZMT5WyWIG4H46xxZVK2Ov5s1MDJAODT7KT8viVDcafJ6I5196Yo0uarU78nunps15-LkLRDdRBnEXU1F/s1600/close3.png" /></a><blink>Klik Like yah..?</blink></div>
<center>
<div style="background: #fff;">

<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlog-Anak-Bima&amp;width=260&amp;height=290&amp;colorscheme=light&amp;show_faces=true&amp;border_color=grey&amp;stream=false&amp;header=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:260px; height:290px;" allowtransparency="true"></iframe>

</div>
</center></td>
</tr>
</table>
</div>
<!-- akhir -->

NB: Sebelum kode diatas diletakan kedalam widget sobat,terlebih dahulu sobat harus letakan script ini terlebih dahulu kedalam Template sobat, berikut script nya letakan dibawah tag <body>:


<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/id_ID/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>


Perhatian:
1. Kode Yang Berwarna Biru adalah keseluruhan dari code plugin like box yg di dapat dari FB Pages.
2. Kode Yang Berwarna Merah Silahkan Ganti Dengan Alamat Facebook Anda.
6. Klik Simpan Dan SELESAI...!

Demikian Tutorial Yang saya buat dengan sepenuh hati saya semoga bermanfaat untuk sobat blogger semua...Salam Blogging..!




Artikel Terkait:

26 comments:

  1. Thanks sudah berbagi ilmunya, sukses selalu...

    ReplyDelete
  2. thank's, ane bisa pake.. tapi kenapa yah pas di close, di samping alamat blognya ada tulisan /#close ... tau gak cara ilanginnya

    tolong pencerahannya yah!!

    ReplyDelete
  3. Keren sob, terima kasih ilmunya...

    ReplyDelete
  4. Bagus dan lengkap tutornya..

    terima kasih akan saya coba dulu..
    :)

    ReplyDelete
  5. Bisa dipasang di WP/Wordpress juga gak ya ?
    habisnya keren bro...Thanks !

    ReplyDelete
  6. kereennnn...... thanks yeahhh bwt infonya :) jaya terus.

    ReplyDelete
  7. muakasih gan...ane pake cara agan di blog ane ..

    ReplyDelete
  8. Caranya gimana


    tolong pencerahannya

    ReplyDelete
  9. Ma kasih sob buat ilmunya.

    Salam sukses selalu...

    ReplyDelete
  10. Keren widgetnya
    informasi yang sangat bermanfaat buat blogger semua
    salam sejahtera blogger

    ReplyDelete
  11. sip keren. terimakasih banyak bos tutorialnya. setelah saya tertapkan akhirnya berhasil. ternyata tidak sesuliat yang saya bayangkan.

    ReplyDelete
  12. Wah kok saya gagal terus yah .
    udah ikutin langkah" nya
    Tapi cuma dapet box kosong berisikan "Close"

    Di HTML saya gak ada <Body
    adanya <Body...Blablaba sama </Body

    Mohon pencerahannya

    ReplyDelete

Syarat Berkomentar:
Tanpa Sara
Tanpa Spam
Jangan Membuat Link Hidup Di Tengah Komentar
Berkomentarlah Yang Sopan Dan Bijak Agar Diharagai Oleh Orang Lain.
Komentar Yang Mengabaikan Syarat Diatas Akan Di Hapus,Terima Kasih...!

Followers

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites More