Membuat Menu Horizontal

Kalian tau kan Menu Horizontal? Ya, Sebuah kumpulan beberapa link yang di letakkan secara horizontal dan berada dibawah Header. Dan sekarang saya akan memberitahu cara membuat Menu Horizontal yang sederhana. Cara membuat Menu Horizontal saya dapatkan di blog Forantum.blogspot. Oke langsung saja

Berikut cara membuat Menu Horizontal :

• Login ke akun blog kamu
• Pilih Tata letak, lalu Edit HTML, lalu centang "Expand Template Widget".

Tips : Sebelum mengedit Template, sebaiknya Save dulu template kamu yang ada dengan mengklik tulisan Download Template Lengkap supaya jaga-jaga jika terjadi kesalahan.

• Cari kode ]]></b:skin> dan Copy-paste kode berikut tepat diatasnya

/* navbar<br /> ================== */<br /> <br /> #bg_nav {<br /> background: #ffffff;<br /> width: 850px;<br /> height: 29px;<br /> font-size: 11px;<br /> font-family: Arial, Tahoma, Verdana;<br /> color: #000000;<br /> font-weight: bold;<br /> margin: 0px auto 0px;<br /> padding: 0px;<br /> border-top: 1px solid #000000;<br /> border-bottom: 1px solid #ffffff;<br /> overflow: hidden;<br /> }<br /> #bg_nav a, #bg_nav a:visited {<br /> color: #000000;<br /> font-size: 11px;<br /> text-decoration: none;<br /> text-transform: uppercase;<br /> padding: 0px 0px 0px 3px;<br /> }<br /> <br /> #bg_nav a:hover {<br /> color: #000000;<br /> text-decoration: underline;<br /> padding: 0px 0px 0px 3px;<br /> }<br /> <br /> #navleft {<br /> width: 500px;<br /> float: left;<br /> margin: 0px;<br /> padding: 0px;<br /> }<br /> #navright {<br /> width: 220px;<br /> font-size: 11px;<br /> float: right;<br /> margin: 0px;<br /> padding: 3px 5px 0px 0px;<br /> }<br /> #navright a img {<br /> border: none;<br /> margin: 0px;<br /> padding: 3px 5px 0px 0px;<br /> }<br /> <br /> #nav {<br /> margin: 0px;<br /> padding: 0px;<br /> list-style: none;<br /> }<br /> #nav ul {<br /> margin: 0px;<br /> padding: 0px;<br /> list-style: none;<br /> }<br /> <br /> #nav a, #nav a:visited {<br /> background: #ffffff;<br /> color: #000000;<br /> display: block;<br /> font-weight: bold;<br /> margin: 0px;<br /> padding: 8px 15px 8px 15px;<br /> border-left: 1px solid #ffffff;<br /> }<br /> #nav a:hover {<br /> background: #c06000;<br /> color: #000000;<br /> margin: 0px;<br /> padding: 8px 15px 8px 15px;<br /> text-decoration: none;<br /> }<br /> <br /> #nav li {<br /> float: left;<br /> margin: 0px;<br /> padding: 0px;<br /> }<br /> #nav li li {<br /> float: left;<br /> margin: 0px;<br /> padding: 0px;<br /> width: 150px;<br /> }<br /> #nav li li a, #nav li li a:link, #nav li li a:visited {<br /> background: #ffffff;<br /> width: 160px;<br /> float: none;<br /> margin: 0px;<br /> padding: 7px 30px 7px 10px;<br /> border-bottom: 1px solid #ffffff;<br /> border-left: 1px solid #ffffff;<br /> border-right: 1px solid #ffffff;<br /> }<br /> #nav li li a:hover, #nav li li a:active {<br /> background: #c06000;<br /> padding: 7px 30px 7px 10px;<br /> }<br /> <br /> #nav li ul {<br /> position: absolute;<br /> width: 10em;<br /> left: -999em;<br /> }<br /> <br /> #nav li:hover ul {<br /> left: auto;<br /> display: block;<br /> }<br /> #nav li:hover ul, #nav li.sfhover ul {<br /> left: auto;<br /> }

• Cari kode </b:section> dan   </div> 
• Jika sudah ketemu, maka Copy-paste kode berikut dibawah kode yang berwana hijau tadi atau yang berwarna merah

<div id='bg_nav'><br /> <div id='navleft'> <div id='nav'> <ul> <li><a href='http://Alamat_Blog_Kamu.blogspot.com/'>home</a></li> <li><a href='http://Link_yang_dituju'>Add Link</a></li> <li><a href='http://Link_yang_dituju'>Add Link</a></li> <li><a href='http://Link_yang_dituju'>Add Link</a></li> <li><a href='http://Link_yang_dituju'>Add Link</a></li> </ul> </div> </div><br /> <div id='navright'><br /> <form action='http://Alamat_Blog_Kamu.blogspot.com/search' id='searchform' method='get' name='searchform'><input id='s' name='q' type='text' value=''/> <input id='searchsubmit' type='submit' value='Cari'/><br /> </form><br /> </div><br /> </div><!-- akhir bg_nav -->

• Lalu simpan.

NB: Link yang di tuju adalah url yang apabila di klik oleh pengunjung dan Add link adalah Nama dari url tersebut,ex: My Video, My picture etc.

Oke sampai disitu dulu.

SELAMAT MEMBUAT MENU HORIZONTAL