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.
0 comments:
Post a Comment