karna melalui facebooklah orang lain dapat mengetahui produk yang kita jual, blog kita dan lain-lain deh.
biasanya kita membuat suatu halaman khusus di facebook yang sering di bilang sebagai halaaman fans page/fans penggemar dan lain-lain lagi. yang akan kita bahas kali ini adalah Cara Membuat Facebook Like Auto Hide Di Blog, sobat psti tau kan maksudnya kalo tidak tau sobat bisa lihat sendiri di gambar, atau melihatnya di bagian samping kanan blog ini(jika blog ini masih menggunakannya).
Cara Membuat Facebook Like Auto Hide Di Blog tidak jauh beda dengan Cara Membuat dan Memasang Like Box Facebook di Blog, bedanya cara ini agar facebook box like fans page kita terlihat lebih menarik dan tidak terlalu memakan banyak tempat di blog kita, ehm pasti udah pada ngertikan kan sob?!?
oke jika sobat berminat dengan memasasang facebook like auto hide di atas, sobat bisa ikuti langkah-langkah berikut, kemon . . . !!!
1.Pertama-tama silahkan sobat login ke blog sobat.
2.Pada Menu tab klick Rancangan ➮ Edit HTML
3.Pada kotak Edit Template cari kode <head>
4.Jika sudah ketemu sekarang letakkan kode berikut tepat di atas kode tadi
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
5.Sekarang simpan template.
6.Sekarang kembali klick Rancangan ➮ Tambah Gadget ➮ Pilih HTML/Java Script.
7.Copy kode script berikut dan letakkan di dalam Gadget kotak HTML/Java Script tadi,
<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=http://www.facebook.com/dekrif&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://lessonphp.blogspot.com/2012/04/cara-membuat-facebook-like-auto-hide-di.html">Get this widget</a></b></span>
</div>
</div>
/*<![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=http://www.facebook.com/dekrif&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://lessonphp.blogspot.com/2012/04/cara-membuat-facebook-like-auto-hide-di.html">Get this widget</a></b></span>
</div>
</div>
Keterangan: ganti warna merah dengan url/alamat fans page sobat.
8.Simpan, dan lihat hasilnya!
Gimana mudah bukan? okelah sob sekian dulu untuk articles/postingan kali ini, semoga bermanfaat.
0 comments:
Post a Comment