Tutorial Navigation Bar
Friday, 13 January 2012|| 0 Comments
Tahu tak ape itu navigation bar?mesti tahu kan ?
Kebanyakan Navigation bar hanya untuk pengguna blogskin sahaja.
Tak ramai juga yg guna blogskin kan?
Jadi aku edit la navigation bar untuk pengguna template denim.
kalau template len, aku kurang pasti lah.Nak tengok tak macam mana nagivation bar yg aku edit?
ini sebelom disentuh oleh cursor
ini selepas disentuh oleh cursor
Lihat kan perbezaannya?
Nak try guna?
Jom aku ajar. tapi ingat, korang kena buat kedua-dua step tau.
First Step !
1 - Design => Edit HTML
2 - Cari perkataan ni
/* Header
3 - Copy kod kat bawah ni dan pastekan di atas kod /* Header tadi. Dan Save.
a.navi {4 - Save lah
background: url(URL IMAGE);
padding-left: 12px;
padding-right: 12px;
color: #46a8fa;
margin-right: 4px;
border-radius: 5px;
-webkit-transition: 1s;
}
a.navi:hover {
background: url(URL IMAGE);
color: #46a8fa;
-webkit-transition: 1s;
}
Note :
hijau : URL gambar yg korang nak letak
oren : warna Love tu
Second Step !
Okay, sekarang kita di step yg kedua.
1 - Design => Add A Gadget => HTML Java/Script
2 - Paste kod kat bawah ni di dalam kotak HTML Java/Script
<td valign="top" style="line-height:15px; font-size:11px; width:240px; background:transparent; border-radius:10px;">
<center><a class="navi" onclick="document.getElementById('pages').innerHTML=document.getElementById('can').innerHTML" title="About" href="URL LINK"> ?</a>
<a class="navi" onclick="document.getElementById('pages').innerHTML=document.getElementById('you').innerHTML" title="Archives" href="URL LINK"> ?</a>
<a class="navi" onclick="document.getElementById('pages').innerHTML=document.getElementById('feel').innerHTML" title="Stuff" href="URL LINK"> ?</a>
<a class="navi" onclick="document.getElementById('pages').innerHTML=document.getElementById('it').innerHTML" title="Posts" href="URL LINK"> ?</a></center><br /></td>
3 - SAVE la. Dan lihat hasilnya
'Sory lah, saya xletak dalam blockquote sebab kod tu terlalu panjang.'
Note :
biru : tulis la ape-ape yg korang rase patot
grey : letak URL link page korang