Tutorial kali ini adalah bagaimana Cara membuat Floating Like Page Facebook Diblog.Banyak sih blog yang menyediakan tutorial seperti ini dan kayaknya uda ga laku lagi (hehe) soalnya sudah jadul alias jaman dulu.Namun saya akan men-share siapa tau sobat menginginkannya dan bisa melihat contohnya pada halaman sisi kanan blog saya. Ada tulisan facebook dan jika kursor diarahkan kesana maka halaman facebook Eghooy Main Blog akan muncul, Nah kurang lebih seperti itu yang dikatakan Floating facebook like. Pengen blog sobat seperti itu ? silahkan cek tutorialnya .
Langkah 1 :
- login ke dasbord blogger
- pilih menu Template kemudian edit Html
- pilih lanjutkan
- jangan lupa untuk expand widget
- cari kode </head>
- letakkan kode berikut di atas kode head tadi , <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
- save template
Langkah 2 :
- pilih menu Tata letak pada dasbord
- add gagdet
- piih html/javascript
- masukkan kode berikut,
kode/script
<script type="text/javascript">
//<!--
$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.w2bslikebox{background: url("http://3.bp.blogspot.com/-KdSAuv-K7HM/To_WXoWHzJI/AAAAAAAAGvg/5UvL10LUe_k/facebook.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=GANTI URL FAGE ANDA&width=245&colorscheme=light&show_faces=true&connections=9&stream=false&header=false&height=330" scrolling="no" frameborder="0" style="border: medium none; overflow: hidden; height: 330px; width: 245px;background:#fff;"></iframe><span><a href="http://daftar-harga-handphone2013.blogspot.com/2013/04/cara-membuat-floating-like-page.html">Mau widget ini ?</a></span></div></div>
pada tulisan GANTI URL FAGE ANDA, hapus kata tersebut dan ganti dengan url halaman facebook anda.
kemudian klik simpan.
Contoh url fage saya http://www.facebook.com/pages/Eghooy-Main-Blogs/440904549308349
SELESAI
Semoga Bermanfaat :)
Tidak ada komentar:
Posting Komentar