Untuk memasang menu bar dibawah header, seperti yang boleh anda lihat pada blog ini ataupun di template classic(sila klik), sila ikut beberapa langkah yang di tunjukkan di bawah.
p/s: Sila save script template anda.
Langkah 1
Log in blog => Dashboard => Layout => Edit HTML.
Langkah 2
Dengan menggunakan keyboard, taip atau paste kod ]]></b:skin> pada ruang Find. Seterusnya tekan Enter.
Langkah 3
Salin kod berwarna biru di bawah dan paste di atas atau sebelum kod ]]></b:skin> ( rujuk langkah 2)
p/s: Anda boleh edit kod warna yang di bold mengikut keseuaian blog anda jika perlu.
.invertedshiftdown{
padding: 0;
width: 100%;
border-top: 5px solid #000;
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{
float: left;
display: block;
font: bold 12px Arial;
color: black;
text-decoration: none;
margin: 0 1px 0 0;
padding: 5px 10px 9px 10px;
background-color: white;
-moz-border-radius-bottomleft: 5px;
border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
border-bottom-right-radius: 5px;
}
.invertedshiftdown a:hover{
background-color: #000;
padding-top: 9px;
padding-bottom: 5px;
color: white;
}
.invertedshiftdown .current a{
background-color: #D10000;
padding-top: 9px;
padding-bottom: 5px;
color: white;
}
Langkah 4
Salin kod merah di bawah dan edit pada notepad. Gantikan kod merah yang di bold dengan URL dan teks pilihan anda.
<div class='invertedshiftdown'>
<ul>
<li><a href='masukkan URL di sini'>Link 1</a></li>
<li class='current'><a href='masukkan URL di sini'>Link 2</a></li>
<li><a href='masukkan URL di sini'>Link 3</a></li>
<li><a href='masukkan URL di sini'>Link 4</a></li>
<li><a href='masukkan URL di sini'>Link 5</a></li>
<li><a href='masukkan URL di sini'>Link 6</a></li>
</ul>
</div>
<br style='clear: both;'/>
Langkah 5
Dengan menggunakan keyboard, taip atau paste kod <div id='content-wrapper'> pada ruang Find dan seterusnya tekan Enter.
Langkah 6
Salin kod berwarna merah yang telah di edit (rujuk langkah 4) dan paste kod tersebut di bawah atau selepas kod <div id='content-wrapper'> (rujuk langkah 5)
Akhir sekali, klik Preview dan jika tiada mesej Error yang terpapar, klik saja Save.
53 comments
tak boleh buat tak tahu salah kat mane
thanks for the sharing anyway dont forget to checkout my blog at http://markjue92.blogspot.com I'm following u
salam bro.. sehat2 hendaknya.
@Fyzal
Ok jer.Cuma bz. Kehkeh.Terima kasih sebab singgah.
maken lame, makin ensem blog ni,,huhuh
Terimakasih tutorialx, sgt bermanfaat
Yang ni gua pasang kat blog baru gua. Tqs Nes!
kod lama? i mean yg versi 1 tu mcm mna?
@ZELL
Tengok kat sini
http://maribinablog.blogspot.com/2010/02/cara-pasang-menu-bar-pada-blog.html
tak jumpa ruang find pun untuk buat
@ABDUL HALIM
Ada. Atas button Start.
salam, blog templates sy dah ada menu bar di atas header tu tp, sy nak change ,kalau boleh nak buang menu yg sedia ada nak ganti dgn menu yg admin gunakan...bagaimana??
SALAM NES...NAK MINTAK TOLONG SIKIT...BAR DA KUAR, TAPI BILA KLIK DIA TULIS " Sorry, the page you were looking for in the blog VEMMA does not exist." KENAPA YER?
@amry
Cuba betulkan URL nya.
ok.berjaya...terima kasih banyak2.best la...tapi ada satu masalah lagi..cam ner bila kita klik bar tu akan akan kuar post yang mengikut tajuk bar tu?
da berjaya buat klik bar kuar ikut tajuk bar...huhuhu
tak jadi lah..yg kod bewarna biru tu berada di atas top header..dan menu bar dia menjadi seperti
list bar..kebawah...macam mana nk buat??
tak jumpe ruang find..adesss
utk ruang find tekan CTRL dgn F at the same time.. nanti dia akan kuar kat bwh..
tpkan url tu blog add kite ke ha?
hye
saya tak phmm.. BLURR kalo saye tekan CRL+F die akan timbul bwah tue..tuelah saye x phm ????? bleh beri ajar ??
alhamdulillah.
jadi gak.taip URL kena betul. kalau tak mesti error. Kod yang color merah tu kena letak kat
bawah header baru link tu dok kat bawah header.
Alhamdulilah dah jadi menu bar yg NESCAFE AIS sediakan.... tp kenapa garisan hitam 2 panjang sngat erkkk? leh x bg pendek ckit mengikut saiz blog sy? PLEASE HELP ME NESCAFE AIS
sy rase mcm lagging la lepas buat menu tab nie!!! mcm lame sngat loading utk buka page blog sy.....
Langkah 2
Dengan menggunakan keyboard, taip atau paste kod ]]> pada ruang Find. Seterusnya tekan Enter.
daripada srep yg diberi, saya xjumpa ruang find..yg ada ruang browse sahaja. so, mcmner ye???
thank u......blog aku dah ada perubahan tapi bro aku nak tanya macammane nak masukkan blog orang lain....dalam list blog
nak tanya la..kenapa kalu klik pada menu tu x kuar pun apa yang kita nak..mcm mana nak buat tu?
tekan ctrl+F pada keybord utk buat find...
tq..da jadi..hehe
tryla tengok kat sini Hari Baru
erm..cm susah la...huhu
mende yg last (content-wrapper) takde pon kat HTML tu~
knpe nk letak <[xley letak div] id='content-wrapper'> xdpat? dier ckp phrase not found..
maknenye?
ha'a...id='content-wrapper'> not found
apa maksudnya bro? yang ada div id='page'> saja...
salam bro : nk masukkan URL mcm mana?
'masukkan URL di sini'
saya xberapa faham..mtak tnjuk ajr.. :)
bro nes, aku xjumpe content-wrapper. Help please
@ARC™
Cuba cari kod <div class='main-outer'>
@ARC™
Paste atas kod <div class='main-outer'>
@Nescafe ais
tq bro!
ooooit...bro nes...thanks alottt....bgos ar blog kau.....
nes...tlg aku...camnew nak tetapkan page manew yang each tab tu nak pegi???? camne nak wat new page???
nape xleh linkkan? ckp not found...da betulkan dah huuuuuu
step 2 tuh lepas tekan enter kt fing lepas copy paste x jadi pape pon..nape?? x pham arr bende nih..
Im using this tutorial to put on my blog. :)
link 2 ape?????
saya gune ini. terimakasih tuan blog
tanx
bro, content wrapper xdela dlm template aku camne eh
eh aku dah tanya soalan tu rupenye kih3
main outer pon xde
cmner nk tambah tab ke kanan ni,
salam..nape tab menu bawah header tu ke kiri sangat, x betul2 bawah header.leh x tlg bgtau cane cara nk bg tab tu cun2 bawah header if u get what i mean.
leh tgk www.wanwanijewels.blogspot.com
thanx in advance!