Saya sarankan untuk mem-backup template anda dengan mengklik Download Template lengkap" di bagian atas Edit HTML. Kalau sudah silahkan lanjut dibaca tutorialnya ...
Langusng saja, masih ditempat yang sama ( Edit HTML ) silahkan pasang kode CSS ini diatas kode </b:skin>
/*--- Slide Panel --- */
#top-panel{
background:white;
border-bottom:5px solid #a6c34e;
padding:14px 20px;
text-align:right;
}
#sub-panel{
text-align:center;
}
#sub-panel a{
width:150px;
float:right;
color:#FFFFFF;
text-decoration:none;
margin-right:30px;
font-weight:bold;
background:url(http://trojanbuster.googlepages.com/sub-left.png) bottom left no-repeat #a6c34e;
}
#sub-panel a span{
padding:6px;
background:url(http://trojanbuster.googlepages.com/sub-right.png) right bottom no-repeat;
display:block;
}
strong{color:#000000;}
.face{border:solid 2px #a6c34e; margin-left:10px; float:right;}
/*--- End Slide Panel --- */
Kalau sudah, sekarang cari kode </head> dan pasang Javascript ini diatasnya :
<script src='http://trojanbuster.googlepages.com/mootools.svn.js' type='text/javascript'/>
<script type='text/javascript'>
window.addEvent('domready', function(){
var mySlide = new Fx.Slide('top-panel');
$('toggle').addEvent('click', function(e){
e = new Event(e);
mySlide.toggle();
e.stop();
});
});
</script>
Sudah ? Terakhir pasang kode HTML-nya pasang dibawah kode <body>
<div id='top-panel'>
<img class='face' height='40' src='http://trojanbuster.googlepages.com/face.jpg' width='40'/><strong>Berlangganan Artikel di JogjaWiki.com yuk !</strong><br/>
<a href='data:blog.url/feeds/posts/default'><img src='http://trojanbuster.googlepages.com/feed.gif'/> <i>Berlangganan via RSS</i> Feed</a>
<br/><img src='https://www.co.cc/img/favicon.ico'/><a href='http://www.linkreducer.com/WPOQIWRJ11801' target='new'><b>Domain .CO.CC gratis!</b></a></div>
<div id='sub-panel'><a href='/#' id='toggle'><span>Hide Panel</span></a></div>
Selesai. Tapi ada beberapa konfigurasi yang harus disesuaikan seperti konten didalam slide panel tadi. Bisa RSS Feed atau link referal :D
Saya sarankan, gambar dan javascriptnya kamu pindahkan ke hosting kamu sendiri. Caranya, download dulu gambar atau file JS tersebut ( kopi paste di adress - tekan enter - dan simpan filenya ) baru diupload ke Google Pages atau di Geocities.
Tinggalkan komentar jika ada masalah ya . Happy Blogging :$.
10 komentar:
Thanks friends.
www.friendzetta.blogspot.com
Follow Me Please...
I appreciated it.
Thank's atas tipsnya, bro..
Salam akrab ya...
Keren mas, saya mau pasang ah diblog-ku.
menarik sekali, pengin coba, terima kasih :D
oh, pake mootools ya..
sangat menarik dan bermanfaat sob..jangan lupa kunjungan balik anda sangat kami nantikan untuk kelangsungan hidup blog kami =))
Kok gak mau di Hide Bos panel nya??? Lihat Blog we: http://nasakomputer.co.cc
sipp..!!!
mas maaf mau tannya kalo tampilannya tidak langsung kebuka gimana ya.
jadi tampilannya di klik baru terbuka slide nya.
kalau tidak di klik tampilan biasa hanya terlihat hide panel.
mungkin bisa gak ya jadi Open Panel
trims
Mohon Bantuannya
Thanks friends.
www.didiksus4nto.blogspot.com
Follow Me Please...
I appreciated it.
Posting Komentar
Anda bisa menggunakan HTML seperti <b> , <i>, <s>, <a> ... Jangan spamming, komentar bernada spam akan kami hapus.
Terima kasih telah berkomentar di JogjaWiki