Browse » Home » » Navbar Di Atas Header

Navbar Di Atas Header

@- Login Blog seperti biasa dengan ID Blog milik Anda.
@- Terus Klick TATA LETAK / LAYOUT.
@- Klick EDIT HTML.
@- Lakukan back-up Template dengan mengklick Download Full Template, di maksud untuk memudahkan pengembalian Template seperti semula jika terjadi kesalahan.
@- Kemudian beri tanda Centang pada kotakan kecil di sebelah kiri Expand Widget Templates, dan tunggu sesaat biarkan Loading selesai.
@- Lalu cari Kode yang seperti ini : ]]></b:skin>
@- Jika sudah, silahkan Copy Kode CSS dibawah ini dan Pastekan di atas kode ini >> ]]></b:skin>

#top-panel{
background:#000000 url();
border-bottom:5px solid #363636;
padding:10px 10px;
text-align:left;
font-family: Verdana, Trebuchet, Trebuchet MS, Arial, sans-serif;
font-size:12px;
}
#sub-panel{
text-align:center;
}
#sub-panel a{
width:0px;
float:right;
color:#FF0000;
text-decoration:none;
margin-right:30px;
margin-top:-45px;
font-size:10px;
font-weight:bold;
background:url() bottom left no-repeat;
}
#sub-panel a span{
padding:-10px;
background:url() right bottom no-repeat;
display:block;
}
strong{color:#FFFFFF;}
.face{border:solid 0px #a6c34e; margin:-2px 10px 0px 0; float:left;}
@- Setelah itu silahkan Sobat cari Kode </head>
@- Kemudian Copy Kode Script dibawah ini lalu Pastekan di atas Kode </head>

<script src='http://iyang.googlecode.com/files/toolbarHDR.js' type='text/javascript'/>
<script type='text/javascript'>
window.addEvent(&#39;domready&#39;, function(){
var mySlide = new Fx.Slide(&#39;top-panel&#39;);
$(&#39;toggle&#39;).addEvent(&#39;click&#39;, function(e){
e = new Event(e);
mySlide.toggle();
e.stop();
});
});
</script>
@- Dan yang terakhir silahkan Sobat Copy Kode dibawah ini lalu Pastekan di bawah Kode <body>

<div id='top-panel'>
<img class='face' height='47' src='URL GAMBAR' width='50'/>
ISI KATA-KATA DISINI
<br/>
<span style='color: #1422DB;'>
ISI KATA-KATA DISINI
</span>
<br/><span style='color: #1422DB;'><data:blog.pageTitle/></span></div>
<div id='sub-panel'><a href='/#' id='toggle'><span><img src='http://i377.photobucket.com/albums/oo215/momospeed/hide-tab.gif'/></span></a></div>

@- Jika sudah jangan lupa untuk klick SAVE TEMPLATE
@- Selesai, dan selamat mencoba kawan.
NB : Soal background alias warna latar toolbar, silahkan Sobat atur saja sesuai selera.

Tab Header

3 Comments To Navbar Di Atas Header

makasih mas inyong .. nih santet yang kulo tunggu2 tak save dinotepad dulu ye .. makasih mas inyong
°l||l°
eRGe mengatakan pada
 
°l||l°
saya nyoba gan.. tapi gagal kenapa yua...
°l||l°
puisi jadul mengatakan pada
 
°l||l°
@-puisi jadul : Tutor tersebut sering sekali saya pakai, dan sampai saat ini berjalan mulus.., coba sobat teliti kembali barangkali masih ada yang kurang ?
°l||l°
nwi mengatakan pada
 
°l||l°

Send Your Comment Here

Pernak Pernik Blogger | Copyright 2010 | Template Design © By IMS | Powered By Blogger