Cara Membuat Menu Navigasi Simple dengan mudah

Menu Navigasi adalah sebuah kotak menu yang isinya kumpulan navigasi link yang di isi oleh kategori atau label dari artikel - artikel yang ada di dalam sebuah blog.
dan untuk Fungsinya adalah  Agar blog terlihat lebih Profesional, Membagi artikel ke dalam kategori/label tertentu , dll


baiklah kita mulai saja cara membuatnya !!


- Masuk ke dasbor blog anda
- Pilih menu Template
- Klik edit html
- Cari kode ]]></b:skin> (Gunakan Ctrl + F agar lebih cepat)
- Jika sudah ketemu  Kemudian anda Copas kode di bawah ini tepat di atasnya (kode ]]></b:skin>)

#menubar{
width:1000px;
height:32px;

background:#de360f;
margin: 0 auto;
}
#menubar ul{
float:left;
margin:0;
padding:0;
}
#menubar li{
float:left;
list-style:none;
margin:0;
padding:0;
}
#menubar li a, #menubar li a:link{
border-right:1px solid #F0512D;
float:left;
padding:8px 12px;
color:#fff;
text-decoration:none;
font-size:13px;
font-weight:bold;
}
#menubar li a:hover, #menubar li a:active, #menubar .current_page_item a {
color:#ffa500;
text-decoration:underline;
}
#menubar li li a, #menubar li li a:link, #menubar li li a:visited{
font-size: 12px;
background: #de360f;
color: #fff;
text-decoration:none;
width: 150px;
padding: 0px 10px;
line-height:30px;
}
#menubar li li a:hover, #menubar li li a:active {
background: #F0512D;
color: #ffa500;
}
#menubar li ul{
z-index:9999;
position:absolute;
left:-999em;
height:auto;
width:170px;
margin-top:32px;
border:1px solid ##F0512D;
}
#menubar li:hover ul, #menubar li li:hover ul, #menubar li li li:hover ul, #menubar li.sfhover ul, #menubar li li.sfhover ul, #menubar li li li.sfhover ul{
left:auto
}
#menubar li:hover, #menubar li.sfhover{
position:static
}

- Selanjutnya cari kode <div id="content-wrapper">
  Jika kode <div id="content-wrapper"> tidak ada coba ganti dengan <div id="header-wrapper">      atau <div id="outer-wrapper"> jika masih tidak ada  cari kode <div class='main-outer'>

- Jika salah satu kode di atas sudah ketemu kemudian anda masukan kode di bawah ini tepat di atasnya

<div id='menubar'>
<ul>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li><a href='http://belbersama.blogspot.com/'>Software</a></li>
<li><a href='http://belbersama.blogspot.com/'>Aplikasi</a></li>
<li><a href='http://belbersama.blogspot.com/'>Game</a></li>
<li><a href='http://belbersama.blogspot.com/'>Artikel</a></li>
<li><a href='http://belbersama.blogspot.com/'>Blogger</a></li>
<li><a href='http://belbersama.blogspot.com/'>Photoshop</a></li>
</ul>
</div>

Maka hasilnya akan seperti contoh gambar Menu navigasi di bawah ini

dan  untuk yang menginginkan menu navigasi dropdown, anda hanya perlu mengganti kode di atas dengan kode di bawah ini

<div id='menubar'>
<ul>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li><a href='http://belbersama.blogspot.com/'>Software</a></li>
<li><a href='http://belbersama.blogspot.com/'>Aplikasi</a>
<ul>
<li><a href='http://belbersama.blogspot.com/'>PC</a></li>
<li><a href='http://belbersama.blogspot.com//'>Android</a></li>
</ul></li>
<li><a href='http://belbersama.blogspot.com/'>Game</a>
<ul>
<li><a href='http://belbersama.blogspot.com/'>PC</a></li>
<li><a href='http://belbersama.blogspot.com/'>Android</a></li>
</ul></li>
<li><a href='http://belbersama.blogspot.com/'>Artikel</a>
<ul>
<li><a href='http://belbersama.blogspot.com/'>Blog</a></li>
<li><a href='http://belbersama.blogspot.com/'>Bebas</a></li>
</ul></li>
<li><a href='http://belbersama.blogspot.com/'>Blogger</a>
<ul>
<li><a href='http://belbersama.blogspot.com/'>Widget</a></li>
<li><a href='http://belbersama.blogspot.com/'>Template</a></li>
</ul></li>
<li><a href='http://belbersama.blogspot.com/'>Photoshop</a>
<ul>
<li><a href='http://belbersama.blogspot.com/'>Brush</a></li>
<li><a href='http://belbersama.blogspot.com/'>Plugin</a></li>
</ul></li>
</ul>
</div>

Maka hasilny akan seperti gmbar di bawah  ini

untuk Url blog saya (http://belbersama.blogspot.com) silahkan anda ganti dengan Url blog anda dan menu blog saya anda ganti juga dengan menu anda. untuk kode menu dropdown juga sama saja silahkan anda ganti Url dan menu nya.

Terakhir klik Simpan/Save.