Tuesday, September 27, 2011

Membuat Menu Horizontal-Blogger.com


Apa itu menu horizontal? Menu horizontal adalah menu yang gak vertikal, itu penjelasan singkatnya menu horizontal adalah menu navigasi yang memilki arah deret horizontal. Jadi dengan menu ini, teman2 bisa mengatur beragam menu di blognya masing2. Biasanya menu yang disediakan meliputi home atau halaman depan blog, daftar isi, profil admin, dsb dan tentunya teman2 bisa mengaturnya sedemikian rupa sesuai keinginan masing2.

Agar lebih jelasnya teman2 bisa nengok ke bagian atas alias header blog ini, nah deretan horizontal yang terdapat menu seperti Home, Daftar Isi, English, العربية, dsb itulah yang dinamakan menu Horizontl.


Cara bikinnya seperti biasa teman2 login ke blogger dulu, lalu klik tuh Tata Letak lalu Edit HTML.
Selanjutnya letakkan kode berikut ini tepat di atas kode tag :

" ]]> "

.horizontal-menu{width:100%; overflow:hidden; border-bottom:1px solid #000000;}
.horizontal-menu ul{margin:0; padding:0; padding-left:0px; font:11px Arial; list-style-type:none}
.horizontal-menu li{display:inline; margin:0}
.horizontal-menu li a{float:left; display:block; text-decoration:none; margin-right:2px; padding:2px 2px 2px 2px; color:#000000; background:#999999;}
.horizontal-menu li a:hover{color:#FFFFFF; background:#FF9900}

Setelah itu klik simpan template:

Bagian Utama yang bisa teman2 ubah adalah sebagai berikut:

-------------------------------------
Biru: Itu adalah ketebalan garis pinggir di bawah menu, bagi teman2 yg tdk menginginkannya silahkan 1px diubah menjadi 0px

Pucat: itu adalah warna tampilan menu, contoh:

Orange: Adalah Warna background ketika disorot, ketika tman2 menyorot menu horizon pada blog ini pasti warnanya seperti ini:

Selanjutnya yang harus teman2 lakukan yaitu menaruh kode HTML menu horizontal pada elemen add gadged bagian header (bagian atas blog)

Bagi teman2 yang ternyata template-nya gak ada elemen add gadget pada bagian headernya, maka bisa ditambah dengan menggunakan trik yang berada di postingan "cara menambah add elemen pada bagian header", pilih add elemen di bawah header, bukan yang di atas header. Kalau sudah menerapkan trik tersebut, maka langkah selanjutnya (pastikan anda sekarang berada pada halaman tata letak/layout) adalah klik add gadget/tambah gadget, pilih gadget HTML JavaScript, dan isikan kode HTML berikut di dalamnya.


Klik Simpan Selesai.....

Untuk lebih mudahnya kepada beberapa rekan blogger merasa trik di atas rada susah atau mungkin ribet, maka gak sah khawatir...masih ada alternatif lain, yaitu cara membuat menu horizontal secara instan. Tentu ini hanya membutuhkan waktu yang relatif pendek untuk membuatnya.tidak hanya menu horizontal yang dapat teman2 buat, menu vertikal juga bisa...dan kerennya lagi bisa milih2 gaya/style suka2 kita. Biar gak kelamaan, langsung aja kunjungi web: Accessify.com

Berhubung itu webnya Bahasa inggris, jadi teman2 bisa menggunakan jasa Google translate. Itung2 buat nerjemahin kata2 yg susah. GoOd LuCk~

No comments:

Media Download Gratis