Membuat Like Box Terletak Pada Sidebar

Mau punya Like Box Facebook yang terletak seperti yang ada di bagian interface Halbink Spot ?, caranya tidak sulit kok, cukup ikuti dengan baik langkah-langkah di bawah ini, dibaca sambil di praktikkan yah...

Yang pertama yang harus dilakukan dulu adalah membuat atau menambahkan Jquery terlebih dahulu pada blog kamu, 

1. Login ke Blogger
2. Klik Dasbor>Rancangan>Edit HTML
3. Cari kode </head>, lalu letakkan kode dibawah ini tepat diatas kode </head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript">
</script>

4. Save template
5. kode diatas adalah kode untuk menambahkan Jquery pada blog

Abaikan saja langkah di atas kalau template kamu sudah terinstal Jquery Plugin. jika kalian belum tahu apa itu Jquery, klik saja ini.

Nah, langkah selanjutnya adalah tahap inti, tinggalkan halaman EDIT HTML, selanjutnya beralih ke halaman ELEMEN LAMAN

1. Klik Dasbor>Rancangan>Tambah Gadget>HTML/JavaScript
2. Copy kode dibawah ini

<script type="text/javascript">
//<!--
$(document).ready(function() {$(".floatinglikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.floatinglikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGyrGLBPe4eMtO6o-QO7gr__yL2pQAoW7ouToocXWzOvNS2bRNfItuWhFkrTM9xA3sZwk268QjTevqVZWEb5z7bazUbERZzBZzAZETXqI0l4XM7YLLNGlp5tuYdsnf1WBrhEnMNVWgZ-I/s1600/floatingfb.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 40px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.floatinglikebox div{border:none;position:relative;display:block;}
.floatinglikebox span{bottom: 10px;font: 10px tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.floatinglikebox span a{color: #808080;text-decoration:none;}
.floatinglikebox span a:hover{text-decoration:underline;}
</style><div class="floatinglikebox" style=""><div><iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fpages%2FHalbink-Spot%2F346460465373416&amp;width=251&amp;height=270&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23cccccc&amp;stream=false&amp;header=false&amp;appId=159468740772399" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:251px; height:270px; background:#fff;" allowtransparency="true"></iframe><span><a href="http://i-ab.blogspot.com/2012/04/membuat-like-box-terletak-pada-sidebar.html" target="_blank">+Get This!</a></span></div></div>

3. Ganti https%3A%2F%2Fwww.facebook.com%2Fpages%2FHalbink-Spot%2F346460465373416 dengan Facebook Fan Page Anda.
4. Save
3. Langkah terakhir, klik Save Template

PENTING !!! HARAP DIBACA DULU !!!

Sebelum menyimpan URL Facebook mu, ganti kode-kode pada URL berikut : 

• Titik dua (:) diganti dengan %3A
• garis miring (/) diganti dengan %2F 

Contoh : Misalkan URL Facebook mu http://www.facebook.com/pages/fbanda/123456, setelah diganti maka hasilnya menjadi http%3A%2F%2Fwww.facebook.com%2Fpages%2Ffbanda%2F123456