Bagaimana Cara Membuat Widget Floating Like Facebook di Blogspot

Cara Membuat Floating Like Facebook di Blogspot - Floating like facebook adalah sebuah kotak like facebook yang melayang. Bisa sobat liat disamping kanan blog saya.
Gunanya adalah untuk menghemat space dan membuat tampilan blog lebih rapi. Tentunya bisa buat blog sobat makin keren aja.

Okay langsung saja kali ini saya akan share tutorial Cara Membuat Floating Like Facebook di Blogspot.
Buat sobat yang tertarik Langsung ikuti tutorial dibawah :

• Ø  Cara menambahkan Jquery Plugin 
  
  
  1.  Login ke Blogger
  2. Klik Dasbor>Pilih Rancangan>Klik Edit HTML
  3.  Kemudian Cari kode </head>
  4. Tambahkan kode dibawah ini tepat diatas kode </head> tadi

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

  Note : Abaikan langkah diatas jika template sobat sudah terinstall Jquery Plugin

  
  
  Ø  Cara Menambahkan Kode HTML pada Widget
  
  

  1. Klik Dasbor>Pilih Rancangan>Klik 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/AVvXsEi9jaaplBewInf94dytxM1ei4Q1oo5IYExNCtKHWJ4KI2S-L7bFG63tPnNu82iubFGLWCWovKC47z4CYnT2a7KzCUdPkDmIuOq771045370I15YqLSssum9A9-9ciP1XaCOt71HiI_wi98/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=http%3A%2F%2Fwww.facebook.com%2Fpages%2FSoFyan-NgeBlog%2F237859139656866&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://sofyansniper.blogspot.com/2012/08/cara-membuat-floating-like-facebook-di.html" target="_blank">+Get This!</a></span></div></div> 

  4. Ganti http%3A%2F%2Fwww.facebook.com%2Fpages%2FSoFyan-NgeBlog%2F363758240312594 dengan url Facebook Fan Page milik Anda.
  
  5. Save
  
  
   Catatan : Sebelum menyimpan URL Facebook milik anda, sebaiknya ganti dahulu kode-kode yang terdapat pada URL.
  : dengan %3A
  / dengan %2F
  
  
  Misalkan URL Facebook anda :
  http://www.facebook.com/pages/fbanda/123456
  Anda rubah menjadi
  http%3A%2F%2Fwww.facebook.com%2Fpages%2Ffbanda%2F123456
  
  
  Semoga bermanfaat ^^