5/07/2012

Cara Membuat Like Facebook Auto Show Pada Blog

Cara Membuat Fb like auto hide di blog tampilan keren –  Jika sebelumnya saya membuat tutorial cara membuat Fb like auto hide tampilan biasa, kali ini Wan Blogger posting Cara Membuat Fb like auto hide di blog tampilan keren, ini tampilannya lebih bagus dari sebelumnya yang tampilannya seperti gambar di bawah ini. Penasaran ingin memasangnya di blog anda, ikuti saja langkah-langkahnya : 

  • Dari Dasboard, Klik Page Elements dan Klik Add a Gadget.
  • Kemudian Pilih HTML/Javascript
  • Copy Paste kode berikut di dalam kotak yang tersedia.
<!-- Mulai Hidden Widget -->
    <style type="text/css">
    .rifaldhi_fixed{
    position:fixed;
    top:175px; /*jarak dari atas*/
    right:0px;
    z-index:+1000;
    }
    * html .rifaldhi_fixed {position:relative;}
    #hidden_rifaldhi {
    display:none;
    border:2px solid #ff1493; /*ketebalan dan warna kotak*/
    -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;
    background:#f1f1ea; /*warna latar*/
    padding:3px 10px 0px 10px;
    }
    </style>
    <div class="rifaldhi_fixed">
    <table id="hidden_rifaldhi" cellpadding="0" cellspacing="0">
    <tr><td>
    <!-- Gambar Atas -->
    <div style="text-float:right"><a href="javascript:void(0)" onclick="rifaldhi_showHiderifaldhi()" title="Close/Tutup"><img style="border:0px; width:auto; height:auto;" alt="Guestbook" src="http://blog.akakom.ac.id/marcell/files/close.png" /></a></div>
    <div class="fb-like-box" data-href=" https://www.facebook.com/pages/Gembys-Blog/258444530867113 " data-width="300" data-height="285" data-show-faces="true" data-stream="false" data-header="true"></div><br/>
    <a href="http://gembysportian.blogspot.com" class="twitter-follow-button" data-show-count="false">Script by : GembyBlog</a>
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
    <br/>
    <script type="text/javascript" src="http://bukutamu-zies-name.googlecode.com/files/bukutamu-zies-name.js"></script>
    </td></tr></table></div>
    <!-- Gambar Samping -->
    <div style="z-index:+5" class="rifaldhi_fixed">
    <a href="javascript:void(0)" onmouseover="rifaldhi_showHiderifaldhi()">
    <img style="border:0px;" src="http://3.bp.blogspot.com/-iU4EZ0b6cyo/Tya7WTA5t9I/AAAAAAAAAuQ/ZmrKFxeX8HY/s1600/join.jpeg" /></a>
    </div>
    <!-- Selesai Hidden Widget -->

Keterangan : Agar script ini berjalan sempurna maka anda robah dulu link yang berwarna merah 
https://www.facebook.com/pages/Gembys-Blog/258444530867113 dengan URL Facebook Pans Page anda [saya anggap anda telah mempunyai akun facebook dan telah membuat pans page].
Sampai disini tutorialnya, bila perlu pertanyaan silahkan melalui kotak komentar.

0 comments:

Post a Comment