Tips Membuat Tab Menu / Navbar Menu








Langkah 1

1. Sign blog anda.
2. Klik Design.
3. Klik Edit HTML.
4. Cari kod ini  ]]></b:skin> atau </head>.
5. Copy kod dibawah dan paste sebelum kod ]]></b:skin> atau </head>.


ul#list-nav {
list-style:none;
margin:0px;
padding:0;
width:850px
}

ul#list-nav li {
display:inline
}

ul#list-nav li a {
text-decoration:none;
padding:5px 0;
width:100px;
background:#A020F0;
color:#eee;
float:left;
text-align:center;
border-left:1px solid #fff;
-moz-border-radius: 5px;
}

ul#list-nav li a:hover {
background:#A020F0;
color:#000
-moz-border-radius: 5px;
}


 6. Save template anda.


Langkah 2

1. Klik page element.
2. Klik Add a Gadget.
3. Klik HTML / Javascript.
4. Copy kod dibawah ini, paste pada kotak HTML / Javascript.

<div>
<ul id='list-nav'>
<li><a href='Link'>Home</a></li>
<li><a href='Link'>Tips Blog</a></li>
<li><a href='Link'>List Blog</a></li>
<li><a href='Link'>Blog Tok Guru</a></li>
<li><a href='Link'>Templates</a></li>
</ul>
</div> 


5.Drag ke atas atau bawah element header.



6.Save.

Nota : 1) Untuk langkah 5, anda boleh ubah beberapa kod seperti warna background, border, dan radius.
        
      2)Gantikan teks warna merah dengan link yang anda mahu tuju dan teks warna biru mengikut keinginan anda.

      3) Jika anda hendak tambah tab menu, copy kod <li><a href='Link'>Templates</a></li> paste sebelum kod </ul>




Selamat Mencuba...

3 comments:

Cara Bisnis Dapat Dollar said...

Cara membuat link yang dituju bgaimana sih? yang pastinya nanti link tersebut punya kita sndiri...

semisal ingin mempunyai link mengenai DOWNLOAD, link mengenai TIPS N TRIK, dst, caranya gimana sih?

En Hisyam said...

pertama Anda harus membuat label / kategori di post .. contoh saya ambil di blog Anda .. link tentang "Software Gratis"
Anda klik pada Software Gratis ... akan keluar link http://aurigamaulana.blogspot.com/search/label/Software% 20gratis ... itu link yang dituju ..

Auriga Mualana Khasan said...

tapi nanti setiap dibuka, ada tulisan "Tampilkan posting dengan label Software Gratis. Tampilkan semua posting"

ketahuan donk kalau ini sebenarnya sama dengan label..
cara yang lain ada gk gan? yang lebih canggih

TinGaLkan Jejak