Membuat Menu Horizontal Paling Simpel

Salah satu navigasi/penunjuk arah diblog adalah menubar, sebagai navigasi pasti menu ini sangat berguna. Menu ini berguna untuk mempermudah pengunjung mengenali isi blog kita.

Gambar diatas menunjukan menubar bentuk horizontal, menunjukan profil,daftar isi,kontak dan lain-lain. Berikut ini cara membuat menu horizontal seperti diatas dengan simpel dan sangat mudah.
Langkah-langkahnya:
1. Login dan masuk ke dashboard blogger.
2. Pilih template < edit html

3. Letakan kode dibawah ini tepat diatas kode ]]></b:skin> :

/* Menu Horisontal
---------------------------------------------*/
.menupic{width:100%;margin:0 auto;padding:0 auto;}
.menuhorisontal{background:#e9e9e9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjx0vUIo7GFwKkwQWM3seJD4moG3wtDaXCNBR6u5MXGSOwa-q2SBip-cN5c4TDrpbBeV_xq95AOjsC08A8ulxsGj3Q4HJBbwyvDyo0hRgVg8IcQMhFiUY6OENOZJvamqsY8HZlBB3xO9tA/s1600/bg_menu.gif) repeat-x bottom left;width:980px;height:30px;margin:0 auto; padding:0 auto;border-left:1px solid $bordercolor;border-right:1px solid $bordercolor;border-top:solid 1px $bordercolor;}
.menuhorisontal ul{margin: 0; padding-left: 0px;color:#357798;text-transform: capitalize;list-style-type: none;font:bold 12px Arial, Helvetica,Arial,Verdana,sans-serif;}
.menuhorisontal li{display: inline; margin: 0;}
.menuhorisontal li a{float: left;display: block;text-decoration:none;
padding:7px 7px 7px 7px;border-right:1px solid #dadcde;border-bottom:solid 1px #d2d4d6;color:#357798;}
.menuhorisontal li a:visited{color:#357798;}
.menuhorisontal li a:hover {background:#fff;color:#333;text-decoration:none;border-bottom:solid 1px #fff; /*Background Setelah Pointer Diarahkan */}
.menuhorisontal li.selected a {background:#fff;color:#333;border-bottom:solid 1px #fff;padding:7px 10px 7px 10px;}

4. Cari kode <!-- /header-wrapper -->  (dengan cara klik tombol ctrl+F bersama) Cari letakan kode dibawah ini tepat dibawahnya.

<div class='menupic'>

<div class='menuhorisontal'>

 <ul>

<li class='selected'><a expr:href='data:blog.homepageUrl'>HomePage</a></li>

<li><a href='https://sarastiana.blogspot.co.id '>Profil</a></li>

<li><a href='http://sarastiana.blogspot.com'>Daftar Isi</a></li>

<li><a href='https://sarastiana.blogspot.co.id/2015/09/perangkat-mengajar.html'>Perangkat KBM</a> </li>

<li><a href='http://sarastiana.blogspot.com '>Kontak</a></li>

<li><a href='http://sarastiana.blogspot.com'>Foto Kegiatan</a></li>

<li><a href='http://sarastiana.blogspot.co.id/2015/09/ulangan-online-mtbg.html'>Ulangan Online</a></li>

<li><a href='http://sarastiana.blogspot.co.id/p/artikel-pendidikan.html'>Artikel Pendidikan</a></li>

</ul>

</div>

 </div>

Keterangan: Ganti http://sarastiana.blogspot.co.id dengan URL yang dituju
Semoga bermanfaat