Cara membuat menu horizontal pada Blogspot

Terkadang tampilan menu di atas pada blog itu diatur oleh tema, tapi disini kita akan membuatnya menjadi lebih menarik dan terlihat lebih cantik dan tentunya menu-menu di atas adalah menu pilihan kita sendiri. Menu horizontal atau menu atas pada blog ini sebenarnya terlihat sederhana, tapi jika kita seksama mengamatinya kita akan tahu kelebihannya. Orang pertama kali melihat suatu web/blog adalah dari atas, dan mencari menu-menu pasti dari atas. Oleh karena itu meskipun sederhana tapi itu adalah bagian penting dari web/blog Anda. Oke, disini kita akan mencoba membuat hal itu terlihat tidak biasa atau menjadi lebih menarik dan terlihat cantik.
Caranya, ikuti langkah-langkah berikut ini :
1. Buka akun blog Anda dan langsung saja masuk ke bagian Edit HTML (berada di bagian Rancangan)
2. Kemudian carilah kode di bawah ini :

]]></b:skin>

3. Setelah itu copy pastekan kode di bawah ini tepat di atas kode yang tadi Anda cari.

.menu-solid{

margin: 0;

padding: 0;

float: left;

font: bold 12px Arial;

width: 100%;

border: 1px solid #625e00;

border-width: 1px 0;

background: #ebf225 ;

-moz-border-radius-topleft:7px;

-moz-border-radius-topright:7px;

-moz-border-radius-bottomleft:7px;

-moz-border-radius-bottomright:7px;

}

.menu-solid {

display: inline;

}

.menu-solid a{

float: left;

color: #000;

padding: 9px 11px;

text-decoration: none;

}

.menu-solid a:visited{

color: #cc0000;

}

.menu-solid a:hover, .menu-solid .current{

color: #ffffff;

background: #800000;

text-decoration:none;

-moz-border-radius-topleft:10px;

-moz-border-radius-topright:10px;

-moz-border-radius-bottomleft:10px;

-moz-border-radius-bottomright:10px;

}

4. Kemudian Klik Simpan/Save.
5. Lalu masuklah ke bagian Edit Elemen pada blog Anda (Letaknya di sebelah Edit HTML)
6. Setelah itu Klik Tambah Gadget
    

7. Lalu pilihlah HTML/JavaScript
   
8. Copypastekan code dibawah ini ke dalam HTML/JavaScript tersebut :

<div class='menu-solid'>

<a href='alamat home Anda'target="_blank">Home</a>

<a href='alamat link 1'target="_blank">Link1</a>

<a href='alamat link 2'target="_blank">Link2</a>

<a href='alamat link 3'target="_blank">Link3</a>

<a href='alamat link 4'target="_blank">Link4</a>

</div>

    Catatan :
    Gantilah tulisan yang berwarna biru itu dengan alamat link page sesuai dengan Link Titlenya.
    Gantilah tulisan yang berwarna merah itu dengan Nama Link yang Anda inginkan.


9. Kemudian tempatkan Gadget tersebut di bagian atas postingan tepat dibawah header. (atau Anda bisa
    tempatkan dibagian mana saja yang Anda suka)
10.Klik Simpan/Save.
11.Lihat lah hasilnya...

Selesai deh...