
cara memasang headline news di blog, kali ini akan memposting tentang fanpage facebook auto hide.
Hampir mirip dengan chatbox milik ane yang bisa sobat liat di sebelah kanan halaman ini, widget ini akan muncul di bagian tepi sebelah kanan halaman blog sobat juga.
Tertarik untuk memasang widget fanpage facebook auto hide, ikuti langkah -langkahnya..
Tahap 1
1. log in ke akun Blog sobat.
2. Klik Rancangan --> Edit HTML --> Cari kode </head> ( gunakan Ctrl + F )
3. Letakkan kode berikut di atasnya.
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
Tmbhn : Jika sobat dapati kode tersebut memang sudah ada, hiraukan tahap ini dan langsung ke tahap berikut..
4. Klik Save
Tahap 2
1. Klik Elemen Laman
2. Klik Tambah Gadget
3. Pilih HTML/Javascript
4. Masukkan kode berikut ke dalam kotak yang di sediakan
<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=http://www.facebook.com/pages/idebagus/149904085104258&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://christiantatelu.blogspot.com/2012/01/cara-membuat-fan-page-facebook-auto.html">Tutorial Here</a></span></div></div>
//<!--
$(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=http://www.facebook.com/pages/idebagus/149904085104258&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://christiantatelu.blogspot.com/2012/01/cara-membuat-fan-page-facebook-auto.html">Tutorial Here</a></span></div></div>
Tmbhn : Ganti tulisan bercetak tebal dengan URL page sobat
seperti gambar berikut..
5. Klik save dan lihat hasilnya!!
Semoga tips di atas bisa membantu sobat blogger.. Sekian.
63 comments
Write commentsora dadi
Reply@ADI PRASETIA
Replymakasih kunjungannya mas!!!
makasih lae.. horas...
Replymakasih mas,
ReplyNice sobat, secepatnya akan ane pasang di blog ane.
Replydan jgn lupa blogwalkingnya...!
salam Blogadexme
mantap bos mantap infonya bos like this Garuda Operating System Indonesian
Replyok gan
Replysetelah saya menyimak saya tertarik juga niii
Manteb sob.. thanks infonya... mampir ke blog ane ya sob..
Replymantap bosssss
Replyaq coba.....
mksh info-nya
teruskan berkarya
Poatingnya sangat kreatif,,,ternyata ada juga blogspot yg bisa dimodifikasi sebagus ini.
Replymakasih atas tutorialnya
Replymakasih ya atas tips nya
Replytips ny sangat membantu banget
klo agan sempat like dong fans page saya di http://webfajar.blogspot.com
makasih infonya gan...
Replybaru mau mencoba nih.
doain sukses ya..!!
jangan lupa main2 ke blog ane ya gan
yhanks brohh bermanffaat
Replyvisit http://uccend.blogspot.com ..
setelah jadi datang lagi buat ninggalin komentar...
Replyterima kasih bro.....
MANTAP MAS... langsung di cobak hehehe SEKALIAN ANE MAU NITIP BLOG ANE MAS...(TEMEN TEMEN MAMPIR YA HEHEHE) MAJALAH INTERNET INDONESIA
Replymakasih infonya sangat membantu saya
ReplyAne cobain triknya sob. Thanks udah share.
ReplyHappy blogging
JADI GAN MANTAP MAKASIH LOH..HEHE..
Replydadi mas, matur sembah nuwun.
Replyhttp://suarakuu.blogspot.com/
Dapat ilmu baru ane gan.
Replyhttp://dapah.blogspot.com/2012/09/cara-seo-google-untuk-meningkatkan.html
Salam sukses selalu...
bagus infonya trims..
ReplyThanks gan infonya sangat membantu perkembangan blog saya..
ReplyKunjungan balik di The FIM Site
terima kasih atas infonya.
Replyjangan lupa berkunjung di http://triwahyuhadisaputra.blogspot.com walau hanya sekedar lewat
ko punya saya page nya ga bisa ya.. ga ada id nya..yg di facebook
Replymantap om infonya.....ijin coba dulu yah
Replymangstap gan..
Replykunjungi blog islam sains gan http://naturalofreligion.blogspot.com/
Makasih gan.... sangat sangat membantu....
ReplyKunjungi blog aku ya gan : http://raffiiskandarblog.blogspot.com/
Thanks gan infonya, kunjungan baliknya ditunggu.
ReplyPENTING...
Replythanks y gan.tp punya ana gak berhasil. apanya yg kurang ? mohon dicheck -> http://syaifdesign.blogspot.com
Thanks gan .. dah saya pasang
ReplyThanks inpohnya
Replyhttp://griyocreativee.blogspot.com/
tx gan!!
Replymampir di blog sy http://rheybio.blogspot.com/
keren mas, tak coba thx yaa
ReplyDi blog ane koq kgk bisa ya gan :bingung
Replythx kang sharingnya,
Replypengin buat FP buat promosi produk . . .
ReplyYour blog posts and articles are very interesting and make me become more scientific, keep your blog so I can visit again to see your blog posts and articles later .. thanks for the info
Replymakasih gan,,,
ReplyAne kok gagal sob ?? apa ada script yg salah ?
ReplyMantep gan ane coba dulu di blog ane
Replykenapa ya, di blog saya hanya muncul like doang. yang pernah nge-like gak muncul. solusinya gimana ya?
Replythx
ReplyBisa gak widgetnya dipindah ke kiri??
ReplyJangan lupa mampir yaa
Gan ko yang agan di kotak like nya ada nama pegguna facebooknya sih. kalau yg ane ngak ada, gimana ya gan supaya ada seperti yang punya agan.
ReplyMohon penjelasanya gan.
Nice.. .join gan..blogpribadi http://rusdigheanzblog.blogspot.com/
Replyhehhehehhehe
akhirnya ketemu juga yang aku cari..
Replymantap tutornya gan, ijin mencoba ya...
Replymaksih gan, langsung praktekkkkkkk
ReplyMantab gan
Replykunjungi http://eskun.blogspot.com/
artikel yang bagus sob, ane praktikkan dulu ya
Replyohya kunjung balik yah ke blog saya, saling jalin silaturrahmi sesama blogger Indoneisa
di http://aurigamaulana.blogspot.com
Mkasih kak trik nya ...^^.
Replytq sob
Replymatur nuwun
ReplyMakasih sob buat info cara bikin fans page'ya
Replyklo auto like gimana cara bikinnya gan?
Replythank's
akhirnya nemu lagi , kode nya , yg dulu ilang wkwkwkw
ReplyAda style lain untuk auto-hide nya gak bro?
Replypunya ane gag mau auto hode gan,,,,|
Replykira" apa yang salah ya,,,
syukron buat ilmunya, bermanfaat banget .. ^^
Replyterima kasih sob,, mantap pokoknya
ReplyCara nge-bawahin like box nya gimana gan?
ReplySemoga tutorial kali ini bisa berhasil pada blog Saya...
Replyterima kasih
EmoticonEmoticon