Minggu, 17 Juli 2016

Cara Mudah Membuat Slide Facebook Like Box di Blog

Halo semuanya, Selamat datang di Dionimouz, hari ini saya akan memberikan tutorial Bagaimana Cara Mudah Membuat Slide Facebook Like Box di Blog, dengan cara ini kalian bisa meningkatkan Like di Fanspage Facebook anda ! Mau tau caranya ? Simak dibawah


Ya,demonya seperti gambar diatas, ketika mouse diarahkan ke tombol Facebook, maka Facebook fanspage box anda akan keluar, untuk demonya kalian bisa lihat di bagian kiri blog saya.

Tertarik untuk memasangnya ? Cek dibawah

Cara Mudah Membuat Slide Facebook Like Box di Blog


#STEP1
PEMASANGAN jQuery di Blog (Lanjutkan ke #STEP 2 Jika sudah memasang)
 
1.Buka Blogger
2.Masuk ke Blog yang anda ingin pasang, lalu pilih Template dan klik Edit HTML
3.Cari kode </head> dan letakan kode dibawah ini diatasnya
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

#STEP2
PEMASANGAN Widget Slide Facebook Like Box di Blog
 
1.Buka Blogger
2.Masuk ke Blog yang ingin dipasang lalu klik Tata Letak dan pilih Tambahkan Widget,lalu pilih HTML/Javascript
3.Setelah itu copy kode dibawah dan pastekan di widget tersebut
<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/AVvXsEjeXcPllfPfPf2Zdt48GS4hhF_MyRBI-JbTBuFy2of7W2YWn7-jgnwFcAgoGiZu0Zbm51_V3N54LIf9WLAUwB5zZe29G0Ab9d1BS3Imb2bRNaA6QcUiDQsuUHNUEoOhFY_NeWc0EShIRXU/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/URLFESBUK&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>
4.Eitts.. belum selesai, ganti tulisan berwarna merah dengan URL Kode Facebook anda
5.Save Widget dan Cek Blog anda masing masing

Cukup sekian dari post ini,semoga dapat menambah informasi bagi anda.

Blogger
Disqus
Pilih Sistem Komentar

PERATURAN BERKOMENTAR

(+) Berkomentarlah tanpa menggunakan kata SARA/RAS/AGAMA
(+) Berkomentarlah dengan menggunakan kata kata yang sopan
(+) Jika ada kerusakan Link Download, silahkan berkomentar dengan menggunakan kata kata yang baik