Tips Membuat AutoHide Facebook Fans Page di Samping Kanan Blog
05.24
By
Unknown
Tips / Trik
0
komentar
Cara membuat AutoHide facebook Fans Page Di Sebelah Kanan Blog
Tujuan Blogger memasang sebuah fans page facebook di blog biasanya agar banyak mendapatkan LIKE oleh pengunjung blog tersebut. ada banyak tipe memasang fans page di blog salah satunya dengan membuat fans page melayang di tengah-tengah blog atau hanya memasang widgetnya saja di navigasi blog.
pada Postingan kali ini saya akan berbagi tutorial cara membuat auto hide Facebook Fans Page di samping kanan blog, untuk lebih jelasnya lihat contoh gambar di bawah ini.
Facebook Fans Page |
dengan memasang fanspage Hide facebook di samping blog itu akan membuat blog anda semakin keren, cara kerjanya cukup simpel ketika pengunjung mengarahkan mouse/kursor ke arah logo facebook yang menempel di side bar sebelah kanan maka secara otomatis fans page facebook anda akan tampil.
Cara memasangnya cukup Mudah :
1. copy kode di bawah ini
<script type="text/javascript">
/*<![CDATA[*/
jQuery(document).ready(function() {jQuery(".likebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);});
/*]]>*/
</script>
<style type="text/css">
.likebox{background: url("http://3.bp.blogspot.com/-KdSAuv-K7HM/To_WXoWHzJI/AAAAAAAAGvg/5UvL10LUe_k/facebook.png") no-repeat scroll left top transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:44%;}
.likebox div{border:none;position:relative;display:block;}
.likebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 7px;text-align: right;z-index: 99999;}
.likebox span a{color: gray;text-decoration:none;}
.likebox span a:hover{text-decoration:underline;}
</style>
<div class="likebox" style="">
<div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/Kenzainal.abhdiblog&width=245&colorscheme=light&show_faces=true&connections=9&stream=false&header=false&height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe><span><b><a target="_blank" href="http://otowebsite.blogspot.com/2012/04/cara-membuat-facebook-like-auto-hide-di.html">Get this widget</a></b></span>
</div>
</div>
Note : ganti yang berwarna merah dalam kode di atas dengan Url fans page facebook anda
2. login di blogger.com
3. pilih tata letak
4. tambah gadget
5. pilih HTML/javascript dan pastekan kode yang anda copy tadi kemudian klik simpan
Sekian Tutorial Blogger yang dapat saya berikan pada kesempatan ini semoga bermanfaat... :)
0 komentar: