Membuat Menu Horizontal Secara Manual

Membuat menu di blog bertujuan untuk mempermudah para pengunjung blog kita menuju suatu halaman yang kita kehendaki, atau bisa juga sebagai daftar yang memudahkan bagi para pengunjung untuk menuju ke halaman yang mereka inginkan. Terlepas dari itu semua teman-teman pasti sudah tahu dengan pasti apa kegunaan dari menu itu sendiri. Sebelumnya sih, saya pernah membahas cara membuat menu horizontal yang ketika membuatnya kita juga harus menambah beberapa kode pada CSS. Namun, dipostingan kali ini saya hanya ingin sharing mengenai cara membuat menu horizontal yang amat sederhana dan tentunya cara pembuatannya secara manual (tanpa ada penambahan kode pada CSS).

Menu yang sedang kita bicarakan bisa teman-teman lihat di bawah header atau di atas kotak pencarian, bagaimana - sangat sederhana sekali bukan? Memang menu horizontal ini sederhana sekali, namun fungsinya tetap sama dengan menu horizontal yang pernah saya bahas sebelumnya.

Ya' biar gak kelamaan, mungkin ada teman-teman yang ingin membuat menu seperti itu ke dalam blognya, silahkan diperaktekkan melalui langkah-langkah berikut

1. Silahkan Login ke blogger

2. Klik Tata Letak

3. Teman-teman bisa langsung mengklik "Tambah gadget/ add gadget" dan pilihlah HTML/Java script

4. Teman-teman bisa memasang kode berikut ke dalamnya

<a href="http://t4belajarblogger.blogspot.com/" title="Home"><span style="background-color:#CCCCCC;">HOME</span></a> | <a href="http://t4belajarblogger.blogspot.com/2009/11/bagaimana-kalau-seorang-seniman-lagi.html" title="Daftar Isi"><span style="background-color:#CCCCCC;">DAFTAR ISI</span></a> | <a href="http://t4belajarblogger.blogspot.com/2009/12/sekilas-info.html" title="Sekilas Info"><span style="background-color:#CCCCCC;">SEKILAS INFO</span></a> | <a href="http://t4belajarblogger.blogspot.com/2009/11/free-link-exchange.html" title="Link Exchange"><span style="background-color:#FF9933;">TUKAR LINK YO!</span></a>

*Sesuaikan dengan link anda!!!

5. Simpan gadget HTML anda. Selanjutnya drag/seret gadget yang barusan anda pasang menuju ke bagian atas post body/ elemen postingan.

Ini hanya lah sebuah opsi, teman-teman juga bisa menyimpam gadget tersebut tepat di bagian bawah header, dan jika di bagian bawah header blog anda tidak bisa ditambah gadget baru, maka teman-teman bisa membaca triknya di sini.

Sebagai keterangan, kode HTML menu horizontal di atas hasilnya seperti berikut

HOME | DAFTAR ISI | SEKILAS INFO | TUKAR LINK YO!

Bagi teman-teman yang ingin menambah menu, maka bisa dilakukan dengan cara menambah kode seperti berikut

<a href="http://t4belajarblogger.blogspot.com/2009/11/free-link-exchange.html" title="Link Exchange"><span style="background-color:#FF9933;">TUKAR LINK YO!</span></a>

di bagian ujungnya (setelah tanda pemisah "|"). Dan jangan lupa untuk menyesuaikan tooltips yang muncul ketika link menu anda ditunjuk, maka perhatikan title="tooltips anda di sini!!!"

Selanjutnya perhatikan kode yang saya beri warna biru dan orange. Itu adalah kode warna yang menjadi patokan warna backgroundnya nanti. Bagi teman-teman yang ingin menyesuaikan warna menu dengan seleranya masing-masing, silahkan untuk memilih kode warna di sini.



Semoga bermanfaat []

Tags: Cara memasang menu horizontal, menu horizontal untuk blogger, menu horizontal sederhana, membuat menu horizontal manual, kode html menu horizontal