Cara pasang menu bar pada blog


Untuk memasang menu bar dibawah header, seperti yang boleh anda lihat pada blog ini (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 biru yang di bold mengikut keseuaian blog anda jika perlu.

/* menu bar */
#menubar{
margin: 0;
padding: 0;
float:left;
border:1px solid #e5e5e5;
width:100%;
background:#e5e5e5;
}

#menubar li{
margin: 0;
padding: 0;
list-style: none;
float: left;
font: bold 11px arial;
}

#menubar li a{
display: block;
margin: 0;
padding: 4px 10px;
background: #666;
color: #fff;
text-align: center;
text-decoration: none;
border:2px solid #ffffff;
border-right:3px solid #ccc;
}

#menubar li a:hover{
background: #000;
}

#menubar div{
position: absolute;
visibility: hidden;
}

Langkah 4

Salin kod merah di bawah dan edit pada notepad. Gantikan kod merah yang di bold dengan URL dan teks pilihan anda.

<ul id='menubar'>
<li><a href='#'>HOME</a></li>
<li><a href='masukkan URL profile di sini'>PROFILE SAYA</a></li>
<li><a href='mailto:masukkan e mail di sini'>E MAIL SAYA</a></li>
<li><a href='masukkan link 1'>LINK 1</a></li>
<li><a href='masukkan link 2'>LINK 2</a></li>
</ul>

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.


{ 43 comments.. read them below or add one }

Ahmad Syazwan B. Ahmad Tarmizi Ahmad Syazwan B. Ahmad Tarmizi 4:53 PM
thanks nesface..
mmg pakat html la
fiD fiD 5:40 PM
hehehe,, bro nes,, ade x care gune add gadget jew??? blog aku xsesuai gune care paste kat body,heheh
Liyanaa. Liyanaa. 5:51 PM
guna pages mcm mana T_T
Nescafe ais Nescafe ais 6:21 PM
@Liyanaa.

Pages yang macam mana tu T_T

p/s: T_T = Icon apa tu?
ZELL BUKAN NAMA SEBENAR © ZELL BUKAN NAMA SEBENAR © 11:59 AM
This comment has been removed by the author.
ZELL BUKAN NAMA SEBENAR © ZELL BUKAN NAMA SEBENAR © 12:05 PM
I'm done here, thnx :)

~THNX TO U ! BRU JEK RQ, DA ADA DA TUTORIAL NI :)
myrol92 myrol92 12:53 PM
hehe..thanks nes...
tp nak request tutorial bleh tak..??
Mcm mana nak masukkan flash kat header tu..
mcm blog nes la...??
harap2 bleh berkongsi..


thanx...
hati - ema hati - ema 3:50 PM
best2... mmg ini yg kucari selama in.. TQ.....
qismina qismina 12:51 AM
cantekkkk.. kalu nk tukar2 kaler mcm mn plak? kna adjust kt bagian mn?
annfrendly annfrendly 3:40 AM
banyaknya ilmu dalam blog ni..
terima kasih...
sangat menghargainya..
testing piston testing piston 4:49 AM
kalau takda div id="content-wrapper" macam ne ek?
PKG Langkap PKG Langkap 9:48 AM
kalo xde div id="content-wrapper" mcm ne yer??
Nescafe ais Nescafe ais 10:53 AM
Cuba guna kod yang ni pulak

<div id='content-wrapper'>
PKG Langkap PKG Langkap 9:09 AM
xde jugakla...koding tu warna merah bile search..
azwan azwan 12:20 AM
x pham la ruang find 2 kat ner, bleh x tnjkkan gambar spy sy lg snang nak pham.....=(
worldpure(dot)com worldpure(dot)com 4:41 PM
1.masukkan url profile sy maksudnye kena masukkan link url http sy ke?

2.apakah langkah sebelum masukkan bar ke blog ? cth sy nak letak ..kat makna sy nak type maklumat spt diatas?

3.bila sy dah ikut langkah saudara ajar x keluar pun kotak menu bar tp keluar maklumat paste yg sy edit hxml...mcmana ye..
arienagallery.blogspot.com arienagallery.blogspot.com 10:13 AM
1.saya cuba masukkan menu bar,kenapa bila preview keluar perkataan ni:

2.We were unable to preview your template
Please correct the error below and submit your template again.
Your template could not be parsed as it is not well-formed. Please make sure that all XML elements are closed properly.
XML error message: XML document structures must start and end within the same entity.
JustTheRangersJustTheRangers 1:43 AM
thanks 4 the info nescafe ais
laa_tahzan laa_tahzan 5:52 PM
hai nes...blog sy xdamenu bar...dan saya dah cari serta buat mcm nes ajar...tetapi x boleh...apa saya patut buat??
モddyß♥γz86® モddyß♥γz86® 2:43 PM
1st coding mmg menjadi.... tp 2nd coding x jadi lar!!! dah find < div id='content-wrapper' > tp xder dlm HTML aq pun..... kes nie same mcm comment "testing piston"
IbuAzroy IbuAzroy 2:26 PM
kenapa x de pun perkataan "find"? tolong tolong tolong
IbuAzroy IbuAzroy 4:54 PM
O dah jumpa. thanks a lot. =)
izzzah izzzah 2:12 PM
saya pun menghadapi masalah mcm ddyB.. tu la.bila find < div id='content-wrapper' > tak dijumpai....tolong yerk macam mana nak buat
labu labu 8:34 PM
find guna Ctrl + F senang guna ni tak payah tercari cari kod
Whitey Mommy Whitey Mommy 12:58 PM
encik nes... nak tanya kenapa blog saya tak boleh nak post kalau buat tutorial...contohnya kalau ada simbol ]]> dia akan cakap "head not allow" error knpa ya?
MariaMira MariaMira 2:14 PM
hi..tgh cuba nk try yg nie..almost tutorial saudara berjaya setakat nie...terima kasih yea :)
wan9 wan9 7:39 AM
salam.. saya nk tany skit.. mcmana nk submenu pada menu.. tlg ya..
heygirl heygirl 4:30 PM
salam..kalau nak letak menu kat atas header camne..
Nescafe aisNescafe ais 4:46 PM
@heygirl

Langkah 5 dengan 6 guna kod yang ini

<div id='header-wrapper'>
puteri puteri 4:02 PM
html saya xde div id="content-wrapper" cmne eh?
niza niza 1:08 PM
kenapa sy try byk kli xle ye?
Fitrah CNT Fitrah CNT 9:50 PM
g bisa nich.kode-kode tak bisa tersipan
suzie rahman suzie rahman 1:44 AM
sedg mencari menu ni...
suzie rahman suzie rahman 1:58 AM
tp xder div id='header-wrapper' atau ini div id='content-wrapper'
KAK AYA KAK AYA 1:43 PM
saya pun tak dapat mencari div id='header-wrapper'
far_east far_east 3:59 AM
dah berjaya..klo x dpt jpe div id='header-wrapper' try cr div class='main-outer'..
btol x abg nescafe?
Miss Sunshine Miss Sunshine 8:54 PM
macamana nak buat untuk sub menu?
izuman18 izuman18 4:17 AM
siapa yg ada masalah langkah 5 taip div class='main-outer thx to far_east.Semua step dah siap cuma masalah nak klik link contoh home tu x boleh nak klik apa contoh kena taip cam ni ke http://www.yahoo.com/ ?
Make Your Own Words™ Make Your Own Words™ 11:13 AM
div id='header-wrapper'...div class='main-outer...div id='content-wrapper...saya tak dapat cari..ada kod lain?
sz-bioshine sz-bioshine 11:43 AM
sy masuk kod pd find...tekan enter xkluar apepun...
tifla bin Ismail tifla bin Ismail 2:08 PM
cedih cari tak dapat pun kod 2