memberikan berbagai macam informasi serta tips trik dan tutorial seputaran kesehatan, teknologi, kecantikan, dan informasi lain yang berguna dan terpercaya

Membuat Facebook Likebox Slide Disamping Blog

Membuat Facebook Likebox Slide Disamping Blog

Tanpa banyak Basa Basi, berikut tutorialnya secara lengkap Membuat Facebook Likebox Slide Disamping Blog :

1. Login Akun Blogger Sobat.
2. Lalu Pilih menu Template >> Edit Template
3. Cari Tag </head> dan agar lebih mudah gunakan CTRL + F
4. Paste kan kode dibawah ini, tepat dibawah Tag </head>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
setelah itu klik save template ( simpan template)

5. Setelah Template Tersimpan, beralih ke menu Tata Letak.
6. Lalu pilih tambah Gadget.
7. Pilih HTML/Java Script.
8. Masukan Kode dibawah ini :
<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=https://www.facebook.com/ilmukomputerdanlaptop?fref=ts&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=330" scrolling="no" frameborder="0" style="border: medium none; overflow: hidden; height: 330px; width: 245px;background:#fff;"></iframe><span>Get This<a href="http://www.tipstricks-tutorials.tk/">Widget</a></span></div></div>

Perhatian :
Merah : URL Fanspage Facebook Sobat
Biru     : Adalah Lebar dan Tinggi Fans Page Fb, silahkan sobat sesuaikan sendiri sesuka hati.

9. Lalu klik Save/Simpan.

No comments:

Post a Comment

Belajar Blog

Gudang Service

Temukan Di Facebook

Copyright © Tips Trik Tutorial. All rights reserved. Template by CB. Theme Framework: Responsive Design