Cara Membuat Menu Navigasi Di bawah Header

 Jika Ingin Membuat Navigasi Di Bawah Header Ikuti Langkah Langkah Berikut Ini !..

1. Log in dahulu ke account blogspot sobat.
2. KLik "Page Element" & Klik "Edit HTML"
3. Centangkan "Expand Widget Templates"
4. Copy kode dibawah ini dan letakkan tepat diatas kode ]]></b:skin>


.glossymenu{
position: relative;
padding: 0 0 0 34px;
margin: 0 auto 0 auto;
background: url(http://i730.photobucket.com/albums/ww306/gozhilaq/Menu-background-1.gif) repeat-x; /*tab background image path*/
height: 46px;
list-style: none;
}
.glossymenu li{
float:left;


}
.glossymenu li a{
float: left;
display: block;
color:#000;
text-decoration: none;
font-family: sans-serif;
font-size: 11px;
font-weight: bold;
padding:0 0 0 16px; /*Jangan Dirubah kode Jarak ini*/
height: 46px;
line-height: 46px;
text-align: center;
cursor: pointer;
}
.glossymenu li a b{
float: left;
display: block;
padding: 0 20px 0 8px;
}
.glossymenu li.current a, .glossymenu li a:hover{
color: #fff;
background: url(http://i730.photobucket.com/albums/ww306/gozhilaq/Menu-kiri.gif) no-repeat;
background-position: left;
}
.glossymenu li.current a b, .glossymenu li a:hover b{
color: #fff;
background: url(http://i730.photobucket.com/albums/ww306/gozhilaq/Menu-kanan.gif) no-repeat right top;
}


5. Lalu copy code di bawah ini dan letakkan tepat di atas kode <div id='content-wrapper'>

<ul class='glossymenu'>
<li class='current'><a href='URL-Blog-Kamu'><b>Home</b></a></li>

<li><a href='URL-Link'><b>Judu</b></a></li>
<li><a href='URL-Link'><b>Judu</b></a></li>
<li><a href='URL-Link'><b>Judu</b></a></li>
<li><a href='URL-Link'><b>Judu</b></a></li>
<li><a href='URL-Link'><b>Judu</b></a></li>
<li><a href='URL-Link'><b>Judu</b></a></li>
<li><a href='URL-Link'><b>Judu</b></a></li>

</ul>


Pada teks yang berwarna MERAH sobat isi url tujuan yang di inginkan.
Pada teks yang berwarna KUNING sobat isi dengan judul sesuai dari tujuan dari link tersebut.

Contoh : <li><a href='http://aladdingrup.blogspot.com'><b>TutoriaL</b></a></li>

Dan seterusnya.....

6. Simpan Lalu lihat hasilnya

7. Selesai


Jika Ingin Mengganti " background: url " agar warna tab menu navigasi yang dinginkan sesuai dengan keinginan Anda Silah kan Ganti Dengan Code Navigasi Di Bawah Ini




"background: url"

- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-background-1-abu.gif

- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-kiridiaryosicopy.gif
- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-kanan-abu.gif


"background: url"

- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-background-1ungu.gif

- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-kiri-ungu.gif

- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-kanan-ungu.gif



"background: url"

- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-background-1merah.gif

- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-kiri-merah.gif

- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-kanan-merah.gif



"background: url"

- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-background-1hijau.gif

- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-kiri-hijau.gif
- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-kanan-hijau.gif


"background: url"

- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-background-1biru.gif

- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-kiri-biru.gif
- http://i557.photobucket.com/albums/ss14/KOKON9LOVE/Menu-kanan-biru.gif

Judul: Cara Membuat Menu Navigasi Di bawah Header; Ditulis oleh Unknown; Rating Blog: 5 dari 5