Cara Membuat Fans Page Facebook Keren di Blog

Pada kesempatan kali ini saya akan menjelaskan cara membuat fans page di blog, tetapi kali ini fans pagenya tersembunyi atau slide show seperti yang ada di sebelah kiri blog saya ini. Pertama anda harus buat fans page terlebih dahulu, anda bisa membuatnya dengan klik "buat halaman" di bagian paling bawah facebook anda.

Setelah selesai, anda ikuti langkah-langkah berikut:
1. Masuk ke tab rancangan-edit html dan centang expand elemen widget.
2. Cari kode </head>, dan letakan kode di bawah ini di atas kode </head> tersebut.
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/> 

3. Save template dan klik tab elemen laman.
4. Klik add gadget, pilih tambah HTML/Javascript dan copy kan kode di bawah ini

<script type="text/javascript">
//<!--
$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.w2bslikebox{background: url("http://3.bp.blogspot.com/-KdSAuv-K7HM/To_WXoWHzJI/AAAAAAAAGvg/5UvL10LUe_k/facebook.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=URL FANS PAGE ANDA &amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=330" scrolling="no" frameborder="0" style="border: medium none; overflow: hidden; height: 330px; width: 245px;background:#fff;"></iframe><span><a href="http://gumanta-info.blogspot.com/2012/03/cara-membuat-fans-page-facebook-keren.html">Widget by Gumanta</a></span></div></div>


5. Kemudian Simpan.
Selamat mencoba, jika ada masalah silakan tinggalkan komentar. :)

16 comments:

  1. Wah keren neh gan... kebetulan ane blm punya fan page.. masih desain.. cocok buat di blog ane ne...
    thanks gan tutor and source code nya..

    ReplyDelete
  2. minta tutorial gadget kyak di samping kanan blog Anda dong !!
    (yg ada tombol like, google+1, tweet, etc)

    ReplyDelete
  3. thank you bung tu juga bsa buat follower friend google :D

    ReplyDelete
  4. yah pakek js. bikin loadingny lelet gak?

    ReplyDelete
  5. nice gan...kunjungannya ya??

    ReplyDelete
  6. Wah, makasih gan, berhasil di blog ane

    ReplyDelete
  7. OK sukses
    Asik jga wadgetnya GAn...

    Thank's tips & ama Scriptnya...

    ReplyDelete
  8. Kenapa waktu ane pasang widgetnya kog script yg lain g berfungsi ya gan, hehe.. maklum pemula.. :D

    ReplyDelete
  9. mampir gan http://operatingsystemdebian.blogspot.com ^_^

    ReplyDelete
  10. Matap Gan...!

    Boleh numpang kenal2 gan...!
    Buat sobat2 kalo mau lihat
    Kalimat Bergambar yang Lucu, Lebai, dan Gokil klik link ini

    www.khae7.blogspot.com/

    dijamin senyum

    ReplyDelete
  11. terima kasih sudah sharing ilmunya...mudah-mudahan bermanfaat untuk blogger semua

    ReplyDelete