Menempatkan Menu Horizontal Pada Blogger
Menu horizontal menu navigasi yang memiliki bentuk arah deret horizontal. Jadi dengan menu ini, kita bisa mengatur beragam menu di blog kita. Biasanya menu yang disediakan meliputi home atau halaman depan blog, daftar isi, profil, dsb dan tentunya kita bisa mengaturnya sedemikian rupa sesuai keinginan.
Cara membuatnya seperti biasa perta kali kita login ke blogger, lalu klik 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 selesai di ketik, lalu simpan
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
<div style="overflow:no; width:100%px; height:100%px; padding:0px; border:0px solid #FFFFFF; background:#FFFFFF;">
<div class="horizontal-menu">
<li>
<a href="http://tutorial-sauterico.blogspot.com/">Home</a>
<a href="http:// tutorial-sauterico.blogspot.com/">Profil</a>
<a href="http:// tutorial-sauterico.blogspot.com/">Belajar Blok<;/a>
</li>
</div>
</div>
Kemudian Disimpan
Yang perlu kita ubah adalah pada bagian yang telah saya tandai dengan tulisan miring itu adalah link/URL menu serta bagian yang di-bold/ditebalkan yaitu keterangan dari link/URL tersebut, ex: http:// tutorial-sauterico.blogspot.com ===>> Home
Ya…. Udah selesai. Selamat mencoba, semoga bermanfaat dan sukses.
Posting Komentar