hari ini,eca nak ajar customize menutab korang tu.Bagi yang menggunakan Template Designer terutamanya,sila focus kepada kod "Tab","Menu" dan yang sewaktu dengannya.Jangan pening ye,semua ne adalah perkara basic kod template blog.Pening-pening sedikit je!..Contoh,boleh lihat MenuTab blog ini ataupun blogshop eca --> Kedai Eca
Peringatan,sila BACKUP Template korang dahulu.
Dashboard -> Template -> Edit HTML
1) Korang cari kod yang bermula dengan kod dibawah ini sehingga ada tanda "}" diakhir kod (maksudnya kod penutup...sebelum ada kod /*)
/* Tabs
----------------------------------------------- */
2) Dalam kod yang korang cari tu,korang boleh DELETE kod tersebut.
3) Gantikan kod yang korang delete tadi dengan kod dibawah ini :: (KOD ini sesuai untuk background PUTIH macam eca ne yer)
/* Tabs ----------------------------------------------- */
.tabs-inner {
background: #fff;
margin: .none;
padding: 5px 3px 5px 3px;
}
.tabs-inner .section {
background:#fff;
margin: 0; }
.tabs-inner .widget ul {
padding: 10px;
background: #fff repeat scroll bottom;
}
.tabs-inner .widget li {
background:#fff;
border: 2px dotted #000000;
-webkit-border-radius: 15px 15px 15px 15px;
}
.tabs-inner .widget li a {
display: inline-block;
padding: .5em 1em;
margin-right: 10px;
color: #ffffff;
font: normal normal 15px Pacifico;
background: #747170;
border: 2px dotted #fff;
-webkit-border-radius: 15px 15px 15px 15px;
}
.tabs-inner .widget li:first-child a {
padding-left: 1.25em;
background:#fff;
}
.tabs-inner .widget li.selected a, .tabs-inner .widget li a:hover {
position: relative; z-index: 5;
background: #ffffff;
color: #000000;
}
4) Preview - Save.
BTW,kalau korang nak PREVIEW,pastikan korang dah ada PAGES diletakkan didalam LAYOUT korang.Kalau takde PAGES,manada preview...dan pastikan juga PAGES diletakkan dibawah HEADER.Kalau korang letakkan dibahagian SIDEBAR,tentu-tentu tak dapat!
Kod yang eca sediakan ini akan membuatkan tab korang berwarna kelabu dengan tulisan berwarna Putih.Apabila disentuh,tab korang akan berwarna Putih,tulisan Hitam.Lebih kuranglah macam tu ye.
nak terangkan satu-satu kod tu agak payah,so eca cuma boleh nasihatkan,
"Selamat Mencuba"
sesiapa ada REQUEST buat tutorial,mohon cakap elok-elok kepada eca
15 Comments
thanks for tutorial...menarik!
ReplyDeletesalam utk cantikkan templet hee suka2 saya ada blogspot tu rindu pula tak guna alahai...
ReplyDeletethnks utk komrn pasal bug tu pepijat mmh menyakitkan hti heee
dulu pernah pakai tab skrg dah x pakai. heehhe
ReplyDeleteNice tuto Eca....tak penah guna lagi....
ReplyDeletenice tutor eca :)
ReplyDeletewahh nice tutor eca!
ReplyDeletejijah buat sudahh :)
wahhh..menarikk..!
ReplyDeleteterima kaseh eca...!
nanti boleh cuba..kalau rajin laa..hihih
tutorial yg bagus..ciktom teringin jgk nk buat blogshop tp asyik tertanguh2..last2 busy wat perkara lain..hee
ReplyDeletehai eca, leeza dlm proses tukar blog.. mean domain.. mekasih k'
ReplyDeletecikgu it ni wah hebat sungguh
ReplyDeletebagus eca ni, rajin at toturial :-)
ReplyDeletebagus eca ni... beruntung jadi kawan dia..rajin buat tuto..hehehe
ReplyDeletebagus tutor nih....
ReplyDeletenk bt tab...tp tak tahu nk isi apa dlm tab..hahaha..parah jgk tu :D
ReplyDeletethanks share ye
ReplyDeleteTerima Kasih atas komen anda.
Eca akan balas & terjah anda secepat mungkin.
*-*