Selasa, 18 Desember 2012

Cara Buat Facebook Like Box Pop Up Melayang

Facebook like box pop up melayang buat di blog gan. Selain buat nambah fans ato pengikut di facebook juga biar tampilan blog loe jadi tambah keren dan gak ngabisin tempat di sidebar.


Di postingan kali ini gw bakal ngasi tau cara buat Facebook like box pop up melayang, langsung aja check this out gan.


Cara Buat Facebook Like Box Pop Up Melayang


  • Pertama log in ke Blogger gan.
  • Di Dashboard blog loe klik Layout trus Add a Gadget, abis itu pilih HTML/JavaScript.

  • Setelah kebuka pop upnya loe copy kode di bawah ini gan dan paste di situ.

<style type="text/css">
/*<![CDATA[*/
#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;}
.fbplbadge {background-color:#3B5998;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;left: -47px;width: 47px;background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7FKNsZC944BL_38J8YysmVsyK7k47iqb5y8ZgcaGVdp3uaKF5obFdB8dIPwGwvP0KWINvExzKazMX1MiaYdHt_JEQnIhEl9I-vN7-M6AtyPa2OP0iWozc_BmjAeCKKsH3X5r_5ZLu_Ow/s1600/vertical-right.png");background-repeat: no-repeat;overflow: hidden;-webkit-border-top-left-radius: 8px;-webkit-border-bottom-left-radius: 8px;-moz-border-radius-topleft: 8px;-moz-border-radius-bottomleft: 8px;border-top-left-radius: 8px;border-bottom-left-radius: 8px;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
    (function(w2b){
        w2b(document).ready(function(){
            var $dur = "medium"; // Duration of Animation
            w2b("#fbplikebox").css({right: -250, "top" : 100 })
            w2b("#fbplikebox").hover(function () {
                w2b(this).stop().animate({
                    right: 0
                }, $dur);
            }, function () {
                w2b(this).stop().animate({
                    right: -250
                }, $dur);
            });
            w2b("#fbplikebox").show();
        });
    })(jQuery);
/*]]>*/
</script>
<br />
<div id="fbplikebox" style="display: none;">
<div class="fbplbadge">
</div>
<iframe allowtransparency="true" frameborder="0" rel="nofollow" scrolling="no" src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/ID FACEBOOK&amp;width=250&amp;height=250&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23C4C4C4&amp;stream=false&amp;header=false" style="background: #FFFFFF; border: none; height: 250px; overflow: hidden; width: 250px;"></iframe></div>

  • Lalu cek kodenya di bagian bawah yang tulisanya ID FACEBOOK, trus loe ganti pake id Fb loe. Kalo udah tinggal di save and buka blog loe, bagaimana hasilnya gan? Kalo berhasil bilang thank's sama yang punya blog gan. :)

Note : Kalo cara di atas gak berhasil atau hasilnya kurang maksimal, loe coba copy kode di bawah ini gan.


  • Terus di Dashboard klik Template, lalu Edit HTML.
  • Cari kode </head> kalo udah ketemu paste tu kode tadi sebelum ato di atasnya gan. Cek preview dulu kalo berhasil baru save tempalte gan.

Sekian dulu tips dari gw, semoga bermanfaat gan and selamat menikmati Facebook like box loe yang baru. Jangan malu-malu untuk berkomentar gan.

Tidak ada komentar:

Posting Komentar