skip to main |
skip to sidebar
Cara Membuat Facebook Like Auto Hide Di Blog
07.39
Diposkan oleh dek rif
Tidak bisa di pungkiri bahwa facebook adalah sarana paling efektif untuk usaha online, mencari pembaca blog, dan lain-lain.
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.
seperti pada blog oto website ini yang memiliki halaman fans page di facebook, nah yang kita bahas kali ini bukanlah tentang cara membuat halaman fans page di facebook karna dulu blog ini pernah membahasnya di Cara Cepat Membuat Halaman Fans Page di Facebook, tapi 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> jika ingin lebih cepat mencarinya sobat bisa baca Cara Cepat Mencari Kode HTML.
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://otowebsite.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://otowebsite.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.
UPDATE
Saya juga telah membuat generator Facebook Like Auto Hide yang akan lebih mempermudah Anda, silahkan anda lihat dengan menekan tombol besar berikut.
Ditulis Oleh : dek rif and @otowebsite
Artikel Cara Membuat Facebook Like Auto Hide Di Blog ini dipublish pada hari Rabu, 11 April 2012. Semoga artikel ini bermanfaat untuk Anda.Copy paste wajib dengan ijin saya, serta menggunakan link sumber seperti di bawah. Gunakan etika. Saya akan berlakukan DMCA COMPLAINT secara langsung tanpa pemberitahuan atas copas tanpa mengikuti ketentuan yg berlaku.
Jika Anda menemukan Link Demo/Download/script yang rusak, mohon adukan kepada kami, terimakasih.
Widget for blogger by Oto Website
Copy kode URL berikut dan Paste atau Letakkan ke dalam halaman postingan Blog/Situs Anda.
URL Permalink Article di Atas.
Langganan:
Poskan Komentar (Atom)













25 comments
thx, tutornya sgt bermanfaat...
makasih om,, sangat bermanfaat..
terima kasih banyak atas infonya.,.
MKSih Gan infonya...
@All Oke Sama2 Sob!
Terima Kasih Tutorialnya.... Sangat Bermanfaat
Thanks bnget OM .
OM baik deh . hehehe :D
kunjungi BLOG saya ya . :D
http://cheater-angel.blogspot.com/
Mkasih yg udh mau datang .
Thanks Gan...
Informasinya Sangat Berharga..
jangan lupa mampir di BLOG ane ya...
http://aditya-kenzie.blogspot.com/
gan untuk memasukkan url fan page di mn
@Nanda Cah JogjaSperti yg sya jlskn d atas, gnti teks wrna merah dengan url fans page Anda.
klo ingin yg pling gmpng bisa gunkn generator ini http://otowebsite.blogspot.com/2012/07/new-version-facebook-like-auto-hide-generator.html
thnk ya gan info nya kren..kunjngi jga ya dihttp:// agustinuschilalahi.blogspot.com
sep dh gan
ijin pasang di blogku sob..
@walfchildSlhkan, asal mnyrtkan link sumber, sbgai hak cipta.
Izin sedot...
@Muhammad HusainiSlhkan, asal mnyrtkan link sumber, sbgai hak cipta.
Supaya pengunjung tidak bingung kalo tutor begini sediakan kolom demonya sob.
weh uni dia tips yang saya cari... muanteb..
trim bang atas infonya
salam kenaal dari mautau.net
Thank gan,Sukses slalu... ;)
Thanks Bro ... maju terus blognya ... :)
Thanks... sangat bermanfaat. http://bugardnsehat.blogspot.com
thank's y bang,, sangat bermanfaat...
kunjungi juga http://netmediamu.blogspot.com
thanks tipsnya gan mampir ke blog ane
http://www.ayo-baca.com
Cara Membuat google plus Like Auto Hide Di Blog ada ga mas....boleh ya.
Saya minta bantu.
@Hendry798Coba cek disini http://otowebsite.blogspot.com/2013/04/google-plus-badge-auto-hide.html