Cara Memasang Widget Like Box Facebook Melayang Di Blog

Cara Memasang Widget Like Box Facebook Melayang Di Blog - Widget Like Box Facebook memang sangat berguna untuk sebuah blog maupun website, karena dengan adanya Widget Like Box Facebook pengunjung akan dimudahkan untuk mencari akun kita, Terlebih lagi kalau mereka menyukai atau meng klick tombol Suka Facebook, maka setiap kita meng update postingan akan tampil pada beranda orang orang yang telah menyukai Widget Like Box Facebook. Dengan Memasang Widget Like Box Facebook juga dapat meningkatkan jumlah pengunjung yang datang ke blog kita, karena secara otomatis mereka akan mengetahui update postingan pada beranda facebook. Nah dikarenakan Widget Like Box Facebook ini sangat berguna untuk kemajuan sebuah blog maupun website, maka chinot ingin berbagi kepada sahabat blogger.

Cara Memasang Widget Like Box Facebook Melayang Di Blog yang akan chinot bahas merupakan widget Facebook yang akan tampil melayang ketika sebuah blog atau website dikunjungi oleh para pengunjung, sehingga secara tidak langsung si pengunjung diajak untuk menyukai halaman facebook milik kita untuk mendapatkan postingan terbaru. Tampilan yang simple dan elegan membuat  Widget Like Box Facebook Melayang Di Blog ini sangat bagus untuk dipasang di blog, disertai dengan tombol Close sehingga memudahkan pengunjung untuk menutup Widget Like Box Facebook setelah mereka mengklick tombol suka.

Nah Sekarang bagaimana Cara Memasang Widget Like Box Facebook Melayang Di Blog, silahkan sahabat chinot lakukan langkah langkah dibawah ini.

1. Buatlah Halaman Facebook
2. Setelah itu Buatlah Aplikasi Like Box pada Facebook
3. Ambil Kode script Like Box Facebook dan simpan pada Notepad

Kalau Sahabat sudah mempunyai kode Like Box Facebook, sekarang tinggal Memasang Widget Facebook Melayang Di Blog. caranya sebagai berikut :

1. Login ke akun blogger
2. Pilih Tata Letak
3. Tambahkan Widget Baru
4. Pilih HTML/Javascript
5. Copy Kode dibawah ini dan pastekan kedalam Widget yang baru dibuat tadi.

<!-- Widget Facebook Melayang --!>
<style type='text/css'>
#kotak-facebook {
      position:fixed !important;
      position:absolute; /* IE6 */
      bottom:-1000px;
      right:40%;
      margin:0px 0px 0px -182px;
      width:310px;
      height:auto;
      padding:16px;
       -webkit-box-shadow: 0px 0px 7px #222;
      -moz-box-shadow: 0px 0px 7px #222;
      box-shadow: 0px 0px 7px #222;  background-color:#FFFFFF; font:normal 1em Cambria,Georgia,Serif;
      color:#111;
    -webkit-border-top-left-radius: 20px;
    -webkit-border-bottom-right-radius: 20px;
    -moz-border-radius-topleft: 20px;
    -moz-border-radius-bottomright: 20px;
    border-top-left-radius: 20px;
    border-bottom-right-radius: 20px;}
    #kotak-facebook a.close {
      position:absolute;
      top:-10px;
      right:-10px;
      background:#333;
      font:bold 16px Arial,Sans-Serif;
      text-decoration:none;
      line-height:22px;
      width:22px;
      text-align:center;
      color:#fff;
      border:2px solid #fff;
      -webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
      -moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
      box-shadow:0px 1px 2px rgba(0,0,0,0.4);
      -webkit-border-radius:10px;
      -moz-border-radius:10px;
      border-radius:10px;
      cursor:pointer;
    }
</style>
    <script type='text/javascript'>
    $(window).bind("load", function() {
         // animasikan nilai top saat halaman telah selesai dimuat
         $('#kotak-facebook').animate({bottom:"50px"}, 1000);
        // hilangkan kotak pesan saat tombol (x) di klik
         $('a.close').click(function() {
             $(this).parent().fadeOut();
         return false;
         });
    });
    </script>
    <div id='kotak-facebook'>
<p style=" margin-right:10px;  font-size:15px; color:#000000;">Silahkan Klick Tombol Suka Dibawah Ini.... !!!</p>
<!-- Begin --!>

LETAKAN KODE SCRIPT LIKE BOX FACEBOOK DISINI

<!-- Selesai --!><a class='close' href='#'>&times;</a>
<p style=" float:right;  margin-right:35px;  font-size:10px;" >Powered By <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://chinotthea.blogspot.com/">Facebook</a> and <a style=" font-size:10px; color:#3B78CD; text-decoration:none;" href="http://chinotthea.blogspot.com/2013/05/cara-memasang-widget-facebook-melayang.html">Get This Widget</a></p>
    </div>

Keterangan :

• Gantilah Tulisan yang berwarna Merah dengan kata kata sahabat
• Hapus tulisan yang berwarna Biru dan gantilah dengan Kode Script Like Box Facebook milik sahabat

6. Simpan Widget dan lihatlah hasilnya.

Nah mungkin itu Cara Memasang Widget Like Box Facebook Melayang Di Blog yang bisa chinot sampaikan, apabila sahabat mengerti kode HTML sahabat bisa memodifikasi bentuk dari widget tersebut dengan cara merubah kode script Widget Melayang Di Blog. sekian dan terimakasih.