Laman

Cara Membuat Widget Fanspage Facebook Slide/Geser Di Blog


Cara Membuat Widget Fanspage Facebook Slide/Geser Di Blog - Bagi anda yang mempunyai fanspage di facebook/halaman di facebook yg ingin anda tampilkan di blog anda dengan jendela munculan slide geser, anda bisa menemukan caranya disini, untuk hasilnya seperti yang sudah saya terapkan di blog saya ini, silahkan lihat gambar dibawah ini.

Untuk memasang widget ini di blog anda silahkan ikuti langkah berikut :
  1. Login ke akun blogger anda
  2. Dari dashboard pilih Layout/Tata Letak lalu pilih Add widget/Tambah widget
  3. Pilih "HTML/Javascript"
  4. Masukan script/kode berikut
    <style type="text/css">


    #gb{




    position:fixed;



    top:50px;



    z-index:+1000;



    }



    * html #gb{position:relative;}





    .gbtab{



    height:200px;



    width:30px;




    float:left;



    cursor:pointer;



    background:url('http://1.bp.blogspot.com/-9eRHiE20E4c/TynfIJyt7qI/AAAAAAAACBE/15Q3VtI-PwY/s1600/fb.png') no-repeat;



    }



    .gbcontent{



    float:left;



    border:2px solid #A5BD51;



    background:#F5F5F5;



    padding:10px;




    }



    </style>





    <script type="text/javascript">



    function showHideGB(){



    var gb = document.getElementById("gb");



    var w = gb.offsetWidth;



    gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);



    gb.opened = !gb.opened;




    }



    function moveGB(x0, xf){



    var gb = document.getElementById("gb");



    var dx = Math.abs(x0-xf) > 10 ? 5 : 1;



    var dir = xf>x0 ? 1 : -1;



    var x = x0 + dx * dir;



    gb.style.right = x.toString() + "px";




    if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}



    }



    </script>



    <div id="gb">



    <div class="gbtab" onclick="showHideGB()"> </div>



    <div class="gbcontent">





    <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fbglestradio&amp;width=200&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=false&amp;appId=274616942651567" style="border:none; overflow:hidden; width:200px; height:258px;" allowtransparency="true" frameborder="0" scrolling="no"></iframe><a href="http://glest-computer.blogspot.com/2013/02/cara-membuat-widget-fanspage-facebook.html" target="_blank">Get This Widget</a>







    <script type="text/javascript">



    var gb = document.getElementById("gb");



    gb.style.right = (30-gb.offsetWidth).toString() + "px";



    </script></div></div>

     *.Ganti tulisan yang berwarna biru dengan id fanspage anda
     *.Anda juga bisa mengganti tulisan yang berwarna hijau dengan url gambar anda
     *.Anda juga bisa mengganti tulisan yang berwarna merah dengan script yang lain selain fanspage
  5. Simpan/Save
  6. Selamat Mencoba Dan Semoga Berhasil

Sumber : NGajalae

Tidak ada komentar:

Poskan Komentar