Tutorial: Tab Menu View..

Bismillahirrahmanirrahim.. Assalamualaikum ♥ Hello silent reader ! ♥
Hye all. . have a nice day ok. :DHari ini ieyza ada wat something kat blog ieyza.. ieyza buat tab menu view.so ieyza rasa nak share la kat korang.. before ni ieyza ada ternampak kat satu blog tu,tapi ieyza tanya macam mana tutorial. dia tak nak bagitahu. tak pa. last ieyza search sendiri kat google. so jumpa. so ieyza nak share la dengan korang2 semua. okea.. ta kedekut punya. hee.tapi kalau korang dah tahu tak pa la. saja nak share., 
eh, jap. korang tau ke tab menu view tu macam mana? ha tak tau.,okea, ieyza gitau. tab menu macam pic kat bawah..

ha. macam kat atas nie la. kan ada tab Owner, My Banner, Jom Usha .. so klik satu-satu tab tu dia akan muncul.. ta faham. tengak kat sidebar ieyza k. after guna tuto macam nie blog rasanya tak da la berat sangat. sebab page tak menampung banyak gadget kan. so, caranya senang saja. hee..
Firstly,, korang pergi Dashboard > Design > Edit Html 
dan seach code kat bawah..

]]></b:skin>

then,copy code kat bawah ni, paste di ATAS code yang korang jumpa tadi.

/* tab model 2 ateonsoft.com */ div.Tabateonsoft div.TFs {height: 30px; overflow: hidden;}div.Tabateonsoft div.TFs a{float: left; display: block; text-align: center; text-decoration: none; font: normal 12px arial; padding:3px 5px 3px 3px; margin:0 5px 0 0;letter-spacing:-0.07em;background:url('URLBACKGROUND');color: #ffffff;border:5px groove #ffffff;  -moz-border-radius: 12px 11px;border-radius: 13px 12px;}div.Tabateonsoft div.TFs a:hover{ background:url('URL BACKGROUND');border:5px groove #ffffff;  -moz-border-radius: 12px 11px;border-radius: 13px 12px;}div.Tabateonsoft div.TFs a.Active{ background:url('URL BACKGROUND');color: ;border:5px groove #ffffff;  -moz-border-radius: 12px 11px;border-radius: 13px 12px;font-weight:bold;}div.Tabateonsoft div.Pages{clear: both; overflow: hidden; height:240px; -moz-border-radius: 11px 11px;border-radius: 11px 11px; padding:0;background:url('') -moz-border-radius:5px;}div.Tabateonsoft div.Pages div.Page{height: 100%;padding: 0px; overflow: hidden;}div.Tabateonsoft div.Pages div.Page div.floor{ font-size:11px;padding: 3px 5px; text-align:left;}

yang warna merah tu korang gantikan dengan warna yang korang suka,yang warna fuchsia tu untuk url background k.
pastu dah paste.copy lagi code kat bawah. tapi paste kat bawah ]]></b:skin> k,, tadi kat atas ni kat bawah plak.

<script src='http://h1.ripway.com/andisyam/javascriptku/tabview2atensoft.js' type='text/javascript'/>

ok. save je. k..
pastu pergi ke design > add gadget > html/javascriptpaste code kat bawah ni pula..

<form action="tabateonsoft.html" method="get"><div class="Tabateonsoft" id="Tabateonsoft"><div class="TFs"><a>tab1</a><a>tab2</a><a>tab3</a><a>tab4</a></div><div class="Pages"><div class="Page"><!-- Tab --><div class="floor">Disini letakkan kode untuk tab 1</div></div><!-- end Tab --><div class="Page"><!-- Tab -->Disini letakkan kode untuk tab 2</div><!-- end Tab --><div class="Page"><!-- Tab --><div class="floor">Disini letakkan kode untuk tab 3</div></div><!-- end Tab --><div class="Page"><!-- Tab --><div class="floor">Disini letakkan kode untuk tab 4</div></div><!-- end Tab --></div></div></form><script type="text/javascript">tabateonsoft_name('Tabateonsoft');</script>

ok. korang ganti kan tajuk untuk tab korang kat tab 1,tab 2, tab 3, n tab 4 tu..disini letakkan kode untuk tab tu. pastekan kode korang tu.cth: shoutmix.  oke. siap. save k, kalau tak jadi gitau ieyza...
Bye..

---