Widget Melayang Facebook Fans

Rekan Blogger,

Facebook merupakan salah satu media promosi yang paling banyak digunakan baik itu oleh pebisnis online atau juga oleh blogger biasa seperti Gazefox Personal Blog, hal paling terkenal ialah Facebook Fan Pages. cara membuat Facebook Fan Page sudah pernah saya bahas sebelumnya pada artikel "Cara membuat facebook fans pages" dan sekarang saat nya saya membahas cara bagaimana agar agar facebook page sobat tersebut dapat terintegrasi pada website/blog anda dengan cara membuat Widget Melayang Facebook Fans.

Sebagai contoh dapat anda lihat dibagian sebelah kanan blog ini.

Berminat memasang Widget Melayang Facebook Fans page seperti diatas ? jika jawabannya "IYA" silahkan ikuti tutorialnya dibawah ini, tetapi sebelumnya tekan tombol LIKE dibawah agar anda selalu dapat update terbaru dari Hendsoe Personal Blog via facebook »»»»» Like This Yoooo.....

Langsung Ke Tutorialnya.

• Login ke Blogger Dengan Google Akun Anda
• Jika sudah di dashboard Pergi Ke Rancangan » Edit HTML
• Masukkan javascript berikut di bawah kode ]]></b:skin> :

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>

• Kembali ke dashboard » Rancangan » Tambah Gadget » HTML/JavaScript
• Masukkan kode berikut :

<script type="text/javascript">
/*<![CDATA[*/
jQuery(document).ready(function() {jQuery(".likebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);});
/*]]>*/
</script>
<style type="text/css">
.likebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAJ1MYE2g_F5Tl8UhFRHXv50Wd0mErj9iFUkY8BSYj9j9MDvl8A_eY5ZLxtnsjcAluO1t4u_4cD9VzDKFL9cdLvRqLfYL3H2nhxlBXQNsgeM_cdunNnugZMvREJXWTIfjqXccmzVRvQoM/s1600/fb.png") no-repeat scroll left top transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:44%;}
.likebox div{border:none;position:relative;display:block;}
.likebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 7px;text-align: right;z-index: 99999;}
.likebox span a{color: gray;text-decoration:none;}
.likebox span a:hover{text-decoration:underline;}
</style>
<div class="likebox" style="">
    <div>
 <iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/Hendsoe-Personal-Blog/150606371647725&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe><span><b><a target="_blank" href="http://gazefoxkrisna.blogspot.com/2012/02/widget-melayang-facebook-fans.html">Get this widget</a></b></span>
    </div>
</div>

• Ubah kode yang berwarna merah dengan alamat Facebook Page anda.
• Simpan template.

Dan sekarang lihat hasilnya, sudah sama belum bentuk Widget Melayang Facebook Fans anda dengan yang ada pada blog ini ??

OK cukup sekian dulu tutorial kali ini, tunggu kelanjutannya bagaimana cara membuat Google plus Page yang juga sama seperti yang ada pada blog ini.

Happy Blogging :)