Bagaimana cara membuat dan memasang menu navigasi berada diatas header blog? Ada beberapa contoh menu navigasi diabtaranya menu navigasi horizontal atau menu navigasi bertingkat atau menu navigasi accordion efek smooth jquery. Pada pembahasan kali ini saya akan berikan cara membuat menu navigasi yang fungsinya seperti untuk menu sign up, menu untuk login dan cara pemasangannya berada diatas header blog. Biasanya menu untuk login atau sign up digunakan atau diarahkan ke link forum atau semacamnya. Nah simak cara membuat menu navigasi untuk menu sign / login, register diatas header.
Cara Membuat Menu Navigasi diatas Header Blog
1. Buka blog anda
2. Pada dasbor silahkan pilih Template => Edit HTML
3. Tekan Ctrl+F, cari kode
]]></b:skin> dan letakkan kode berikut diatasnya.toppic{width:100%;margin:0 auto;border-bottom:0px solid #666;}Keterangan : ganti angka dan warnanya sesuai kebutuhan anda
.topnav{background:#ffffff;width: 960px;height:32px;overflow: hidden;margin:0 auto; padding:10px 10px 0px 10px; }
.toppic{background:#ffffff;width:1000px;margin:0 auto;border-bottom:1px solid #999;}
.topnav{width: 960px;height:20px;overflow: hidden;margin:0 auto; padding:0px 0px 10px 10px; }
.menupic{background:#fff;width:960px;margin:0 auto;}
4. Lalu cari kode
<body> dan copy paste kode berikut dibawahnya<div class='toppic'>Keterangan : ganti link diatas sesuai kebutuhan anda
<div class='topnav'>
<div style='font: 11px Arial;float:left;padding-top:3px;letter-spacing:.01em;color:#000000;'>
Wellcome | Members area : <a href='http://www.blogger.com' title='log in to blogger'>Register</a> | <a href='http://www.blogger.com' title='log in to blogger'>Sign in</a> </div>
<div style='font: 11px Arial;float:right;padding-top:3px;letter-spacing:.01em;color:#000000;'>
<a href='http://lintas-tutor.blogspot.com/p/about-me-terlintas.html' title='about me'>About Me</a> | <a href='http://lintas-tutor.blogspot.com/p/contact-us-terlintas.html' target='_blank' title='contact us'>Contact Us</a> | <a href='http://lintas-tutor.blogspot.com/p/daftar-isi-terlintas.html' title='sitemap'>Sitemap</a> | <a href='http://lintas-tutor.blogspot.com/2013/10/pasang-iklan-banner-murah-di-blog.html' title='advertiser'>Advertiser</a></div></div></div>
Demikianlah postingan mengenai cara membuat menu navigasi diatas header, semoga bermanfaat
