Tab Menu Cun!

Assalamulaikum dan hi!

Tutorial kali ni khas untuk sapa nak melawakan tab menu yang cun! Meh sis ada caranya

1. Login >> design >> editHTML >> tick expand widget >> cari kod ini : </b:skin>

dah jumpa kod diatas paste kod dibawah ni SEBELUM kod yang dicari tadi ok

untuk memudahkan pencarian kod dalam editHTML gunakan >> ctrl+F

Why Ctrl+F sebab fungsinya ialah bagi besar skrin

invertedshiftdown{
padding: 0;
width: 100%;
border-top: 1px solid #FFFFFF;
background: transparent;
voice-family: "\"}\"";
voice-family: inherit;

}
.invertedshiftdown ul{
margin:0;
margin-left: 40px;
padding: 0;
list-style: none;
}

.invertedshiftdown li{
display: inline;
margin: 0 2px 0 0;
padding: 0;
text-transform:uppercase;
}

.invertedshiftdown a{
background-color: ##33FF33
float: left;
display: block;
font: bold 12px Arial;
color: black;text-decoration: none;
margin: 0 1px 0 0;
padding: 5px 10px 9px 9px;
border: solid ##33FF33 1px;
-moz-border-radius-bottomright: 1em; -moz-border-radius-topleft: 1em;
-moz-border-radius-bottomleft: 1em; -moz-border-radius-topright: 1em;

}

.invertedshiftdown a:hover{
background-color: ##33FF33;
padding-top: 9px;
padding-bottom: 5px;
color: white;
}

.invertedshiftdown .current a{
background-color: ##33FF33;
padding-top: 9px;
padding-bottom: 5px;

Kalau macam ini ubah la ikut warna blog korang. Seterusnya

2. cari pula kod ini >> <div id='crosscol-wrapper' >

<div class='invertedshiftdown'>
<ul>
<li><a href='LINK'>NAMA 1</a></li>
<li><a href='LINK'>NAMA 2</a></li>
<li><a href='LINK'>NAMA 3</a></li>
<li><a href='LINK'>NAMA 4</a></li>
<li><a href='LINK'>NAMA 5</a></li>

</ul>
</div>
<br style='clear: both;'/>

Link tu merujuk kepada nama tabs korang. Kalau rasa tak cukup tab menu tu korang cuma copy kod yang sama dan buatlah berulang-ulang sehingga cukup pakai ok. Rasa dah cukup dan siap semuanya korang boleh PREVIEW dulu sama ada jadi atau tak. Mesti jadi punya lah ok :) dah puas hati boleh SAVE!