. Tutorial - Vertical menu tab (macam saya)

Dashboard>Design>Page Elements>Add Gadget>Html/JavaScript

<style type="text/css">

/*Credits: Dynamic Drive CSS Library */

/*URL: http://www.dynamicdrive.com/style/ */

.sidebarmenu ul{

width:250;

text align:center;

list-style-type: none;

font: normal 13px Century gothic;

}

.sidebarmenu ul li{

position: relative;

}

/* Top level menu links style */

.sidebarmenu ul li a{

display: block;

overflow: auto; /*force hasLayout in IE7 */

color: white;

text-align:center;

text-decoration: none;

padding: 0px;

}

.sidebarmenu ul li a:link, .sidebarmenu ul li a:visited, .sidebarmenu ul li a:active{

background-color: #FAAC58; /*background of tabs (default state)*/}

.sidebarmenu ul li a:visited{

color: white;}

.sidebarmenu ul li a:hover{

background-color: #F4FA58;}

/* Holly Hack for IE \*/

* html .sidebarmenu ul li { float: left; height: 1%; }

* html .sidebarmenu ul li a { height: 1%; }

/* End */

</style>

<script type="text/javascript">

//Nested Side Bar Menu (Mar 20th, 09)

//By Dynamic Drive: http://www.dynamicdrive.com/style/

var menuids=["sidebarmenu1"] //Enter id(s) of each Side Bar Menu's main UL, separated by commas

function initsidebarmenu(){

for (var i=0; i<menuids.length; i++){

  var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")

    for (var t=0; t<ultags.length; t++){

    ultags[t].parentNode.getElementsByTagName("a")[0].className+=" subfolderstyle"

  if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu

   ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item

  else //else if this is a sub level submenu (ul)

    ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it

    ultags[t].parentNode.onmouseover=function(){

    this.getElementsByTagName("ul")[0].style.display="block"

    }

    ultags[t].parentNode.onmouseout=function(){

    this.getElementsByTagName("ul")[0].style.display="none"

    }

    }

  for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars

  ultags[t].style.visibility="visible"

  ultags[t].style.display="none"

  }

  }

}

if (window.addEventListener)

window.addEventListener("load", initsidebarmenu, false)

else if (window.attachEvent)

window.attachEvent("onload", initsidebarmenu)

</script>

<div class="sidebarmenu">

<ul id="sidebarmenu1">

<li><a href="URL PAGE">FACEBOOK</a></li>

<li><a href="URL PAGE">OWNER</a></li>

<li><a href="URL PAGE">SHOUTBOX</a></li>

<li><a href="URL PAGE">GALERI</a></li>

</ul>

</div>

colour MERAH BIRU HIJAU tu korang boleh tukar lah nak letak warna apa pun untuk tab menu korang, yang penting before korang save korang kena preview dulu okey :)

Pliss....Jgn click rich text.Nanti tak menjadi..Kalau tak jadi,jangan pening pening kepala marah ieyha,Salahkan diri sendiri.Sebab korang tak tengok ieyha tulis sampai habis.

Sila masukkan code di bawah entry sebagai tanda credit, selepas anda mengcopy paste segala tutorial saya.

Credit By <a href="http://sitinurfariha.blogspot.com/p/tutorial_07.html">IEYHA</a>