Selasa, 23 November 2010

Cara Membuat Menu Tab Horizontal Blogger

berikut cara membuat menu tab horizontal seperti yang di BBK.

1.Login Blogger, masuk ke dasbor, pilih rancangan
2.Di rancangan maasuk ke tab menu Edit HTML
3.Centang Expand Widget
4.Cari Script ]]></b:skin> dengan menekan ctrl+f pada browser anda
Copy paste script berikut di atas script ]]></b:skin>

SCRIPTNYA

#tabshori {
float:left;
width:100%;
font-size:13px;
border-bottom:1px solid #2763A5;
line-height:normal;
}
#tabshori ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
#tabshori li {
display:inline;
margin:0;
padding:0;
}
#tabshori a {
float:left;
background: url("http://kendhin.890m.com/menu/blackleft.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabshori a span {
float:left;
display:block;
background: url("http://kendhin.890m.com/menu/blackright.gif") no-repeat right top;
padding:5px 14px 4px 4px;
color:#fff;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabshori a span {float:none;}
/* End IE5-Mac hack */
#tabshori a:hover {
background-position:0% -42px;
}


5.Cari script berikut
SCRIPTNYA





ubah menjadi






Simpan Perubahan (Save)
6.Masih di Rancangan, klik menu Elemen Laman. pilih tambah gadget HTML/Javascript.
Masukkan Script Berikut


SCRIPTNYA


<div id="tabshori">
<ul>
<li><a href="http://blogberbagikita-bbk.blogspot.com"><span>Home</span></a></li>
<li><a href="http://blogberbagikita-bbk.blogspot.com/search/label/Tips%20Trik"><span>Tips n Trik</span></a></li>
<li><a href="http://blogberbagikita-bbk.blogspot.com/search/label/Software"><span>Software</span></a></li>
<li><a href="http://blogberbagikita-bbk.blogspot.com/search/label/Download"><span>Download</span></a></li>
</ul></div>

Tulisan yang ditulis BOLD anda ganti dengan alamat link yang akan dimasukkan,
sedangkan yang ditulis ITALIC anda ganti dengan judul tab/judul link.



7.Letakkan gadget yang tadi dibuat di atas blog/di bagian atas kotak postingan, Simpan Perubahan (Save)
8.Lihat Blog Anda!

Tidak ada komentar: