Cara Membuat Menu Top Navbar

Click gambar untuk Memperbesar
Cara memasang nya cukup mudah ..
  1. Ke Template
  2. HTML
  3. Edit HTML
  4. Lalu Code ]]></b:skin>  , untuk mempermudahnya kalian bisa menekan CTRL+F pada Keyboard
  5. Jika Sudah ketemu pastekan code di bawah ini tepat di atas nya
.topnav{float:center; font-size:11px; margin:0 auto; width:980px; background:black; border:1px dashed #080; position:relative; left:-0px; top:10px; -moz-border-radius:0 5px 5px 0; -webkit-border-radius:0 5px 5px 0; border-radius:0 5px 5px 0}
.topnav ul{height:20px; list-style:none outside none; margin:0 auto; padding:5px 0 12px 40px}
.topnav li{float:left; margin:0; font-size:13px; margin-right:5px}
.topnav li a{color:green; display:block; text-decoration:none; float:left; padding:5px 10px}
a.home{color:red !important; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; -moz-box-shadow:0 0 5px rgba(0,0,0,0.9) inset,0 0 5px #901af5; -webkit-box-shadow:0 0 5px rgba(0,0,0,0.9) inset,0 0 5px #901af5; box-shadow:0 0 5px rgba(0,0,0,0.9) inset,0 0 5px #901af5}
.topnav li a:hover{color:#0f0; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; -moz-box-shadow:0 0 5px rgba(0,0,0,0.9) inset,0 0 5px #0f0; -webkit-box-shadow:0 0 5px rgba(0,0,0,0.9) inset,0 0 5px #0f0; box-shadow:0 0 20px rgba(0,0,0,0.9) inset,0 0 5px #0f0}
.nav_topb{width:30px; height:30px; background:url()no-repeat left top; left:-12px; position:relative; top:89px}
.botnav{float:left; font-size:11px; margin:0 auto; width:980px; background:transparent; border:1px solid #0f0; -moz-border-radius:0 0 5px 5px; -webkit-border-radius:0 0 5px 5px; border-radius:0 0 5px 5px}
.botnav ul{height:20px; list-style:none outside none; margin:0 auto; padding:5px 0 12px 40px}
.botnav li{float:left; margin:0; font-size:13px; margin-right:5px}
.botnav li a{color:blue; display:block; text-decoration:none; float:left; padding:5px 10px}
.botnav li a:hover{color:#901af5; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; -moz-box-shadow:0 0 20px rgba(0,0,0,0.9) inset,0 0 5px #901af5; -webkit-box-shadow:0 0 20px rgba(0,0,0,0.9) inset,0 0 5px #901af5; box-shadow:0 0 20px rgba(0,0,0,0.9) inset,0 0 5px #901af5}
b.home{color:#0e1ef3 !important; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; -moz-box-shadow:0 0 5px rgba(0,0,0,0.9) inset,0 0 5px #0e1ef3; -webkit-box-shadow:0 0 5px rgba(0,0,0,0.9) inset,0 0 5px #0e1ef3; box-shadow:0 0 5px rgba(0,0,0,0.9) inset,0 0 5px #0e1ef3}
    
    6.  Lalu cari lagi Code <body> untuk mempermudahnya kalian bisa menekan CTRL+F pada Keyboard
    7.  Jika sudah ketemu pastekan Code ini di tepat di bawah nya

<div class='topnav'>
<ul>
<li><a href='http:PoLoCheater-7.Blogspot.com'>PoLo Cheater</a></li>
<li><a href='http://www.Poloknow.Blogspot.com/profile/01001272153087337721'>Knowledge Of PoLo</a></li>
<li><a href='http://www.facebook.com/Satria.Mahardika.Firjatullah'>My Facebook</a></li>
<li><a href='http://polocheater-7.blogspot.com/search/label/Bloging/'>Bloging</a></li>
<li><a href='http://polocheater-7.blogspot.com/search/label/Hacking/'>Hacking</a></li>
<li><a href='http://www.google.com/support/blogger/?hl=en'>Help</a></li>
</ul>
</div>
 
     8.  Lalu simpan template .. Check blog anda , akan ada menu navbar atas

NB : Untuk yang berwarna Hijau : Kalian bisa ganti dengan Judul yang kalian mau
        Untuk yang berwarna Biru : Kalian bisa ganti Link tersebut sesuai dengan judul nya

Selamat Mencoba :D
Source: Sopyan-7
Anda baru saja membaca artikel yang berkategori Bloging dengan judul Cara Membuat Menu Top Navbar. Anda bisa bookmark halaman ini dengan URL https://juriseo.blogspot.com/2013/01/cara-membuat-menu-top-navbar.html.
Ditulis oleh: Juri Seo

Belum ada komentar untuk "Cara Membuat Menu Top Navbar"

Posting Komentar