membuat menu horizontal

 

Cara membuat menu horizontal ini cukup mudah, tahap pertama yang harus dilakukan adalah:

- sign in ke blog

- klik layout/tata letak
- klik edit HTML
- (sebaiknya kalian download template lengkap terlebih dahulu, agar jika hasil tidak sesuai dengan keinginan maka bisa dikembalikan seperti semula)
- beri tanda  centang pada Expand Widget Template (agar code widget muncul)
- kemudian cari kode: ]]></b:skin>
- untuk mempermudah pencarian tekan CTRL+F
- letakkan code berikut diatasnya:

 /* linktab

================== */

#linktab{
background:url(http://i634.photobucket.com/albums/uu61/adetea/tabhijau.gif) ;
width: 864px;
height: 30px;
font-size: 11px;
font-family: georgia, Tahoma, Verdana;
color: #ffff66;
font-weight: bold;
margin: 0px auto 0px;
padding: 0px;
border-left: 1px solid #000;
border-right: 1px solid #000;
overflow: hidden;
}
#tabright {
width: 200px;
height: 30px;font-size: 11px;
float: right;
margin-right:10px;
margin-bottom:50px;
padding: 0px;
}
#tabright a img {
border: none;
margin: 5px;
padding: 0px;
}

#linktab ul {
margin:0;
padding:1px 10px 0px 0px;
list-style:none;
}
#linktab li {
display:inline;
margin:0;
padding:0;
}
#linktab a {
float:left;
background:transparent;
margin:0;
padding:0 0 0 3px;
text-decoration:none;
}
#linktab a span {
float:right;
height: 35px;
display:block;
background:transparent;
padding:7px 6px 4px 6px;
color:#ffff66;
border-right: 1px solid #000;
}
#linktab a span {
float:none;
}
#linktab a:hover span {
color:#fff;
}
#linktab a:hover {
background-position:0% -42px;
}
#linktab a:hover span {
background-position:100% -42px;
}

- simpan template

jika template sudah disimpan tahap selanjutnya adalah:

-  masuk ke menu edit laman

- tambah gadget (lihat gambar Klik Disini)
- pilih HTML/JavaScript
- kemudian copy code berikut:

<div id='linktab'>
<ul>
<li><a href='URL Link Disini'><span>Home</span></a></li>
<li><a href='http://almansuqie-tips.blogspot.com/' target='_blank'><span>AlmansuQie</span></a></li>
<li><a href='URL Link Disini' target='_blank'><span>TAJUK</span></a></li>
<li><a href='URL Link Disini' target='_blank'><span>TAJUK</span></a></li>
<li><a href='URL Link Disini' target='_blank'><span>TAJUK</span></a></li>
<li><a href='URL Link Disini' target='_blank'><span>TAJUK</span></a></li>
</ul>

<div id='tabright'>
<form action='http://NAMABLOGSOBAT.blogspot.com/search' id='searchform' method='get' name='searchform'>
<input id='s' name='q' type='text' value=''/>
<input id='searchsubmit' type='submit' value='Cari'/>
</form>

</div></div>

- kemudian simpan

 keterangan: kode yang berwarna ungu adalah kode untuk kotak pencarian, jika kalian tidak ingin menggunakannya kode dapat dihapus