[ Tutorial ] Cara Membuat Fanspage FB Di Blog Melayang

Hallo Sobat blog Markus X-Files ketemu lagi dengan saya sekarang saya akan memandu anda untuk membuat Fanspage Facebook di blog melayang. Trick ini juga merupakan dari SEO karena dengan adanya media social blog akan lebih mudah dikenal orang lain. Nah untuk cara pemasangan media social di blog terutama Facebook yang sudah sangat terkenal ini dapat memberikan keuntungan bagi kita karena dapat secara langsung memberikan trafik pengunjung meningkat dengan cara mengikuti forum blog di Facebook dan mencantumkan link/Url blog kita disitu. 

Bagi anda yang belum membuat Fanspage Facebook silahkan baca di sini karena itu merupakan salah satu langkah yang akan kita pakai untuk langkah ini.

Oke mari saja kita mulai langkah-langkahnya.

1. Pertama Buka blog anda

2. Pilih Tata letak kemudian Tambah Gadget

3. Pilih HTMl/Java Script

4. Copy code dibawah ini

<!-- FB melayang tombol close --!>

<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;">Like this page :D,<blink>Thanks For Reading</blink> </p>

<!-- Mulai --!>

<iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Frakalesandro%2F&tabs=Page&width=300&height=100&small_header=true&adapt_container_width=false&hide_cover=true&show_facepile=false&appId" width="300" height="100" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowtransparency="true"></iframe>

<!-- 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://arlesandro.com">Blogger Widget</a> and </p></div>

Note : Untuk script yang berwarna merah silahkan ganti dengan Fanspage Facebook anda

Sekian turtorial dari saya semoga dapat mengatasi masalah yang sedang anda hadapi dan terimakasih atas kunjungan anda