Apaka sobat pernah liat menu seperti ini ?? atau seperti yang diblog saya ???
Ingin mencobanya , ikuti langkah berikut :
Lankah 1 :
Lankah ke 2 :
Semoga bermanfaat !!! kurang jelas silahkan ke tutorial lengkapnya disini....
Ingin mencobanya , ikuti langkah berikut :
Lankah 1 :
- Pertama login di akun blog saudara atau disini
- Pilih layout > Edit HTML
- Saya sarankan download full template saudara
- Kembali ke pembahasan masi di dalam edit html
- Centang Expand...
- Silahkan saudara cari ]]></b:skin> atau bisa juga dengan cara tekan CTRL+F
- Kemudian Simpan kode berikut tepat diatas kode ]]></b:skin> :
/*- Menu Tabs 10--------------------------- */ /*credits : http://www.exploding-boy.com */ #tabs10 { float:left; width:95%; font-size:13px; border-bottom:1px solid #2763A5; line-height:normal; } #tabs10 ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabs10 li { display:inline; margin:0; padding:0; } #tabs10 a { float:left; background:url("http://ilmu27blogger.googlecode.com/files/tableft10.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabs10 a span { float:left; display:block; background:url("http://ilmu27blogger.googlecode.com/files/tabright10.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#FFF; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabs10 a span {float:none;} /* End IE5-Mac hack */ #tabs9 a:hover span { color:#FFF; } #tabs10 a:hover { background-position:0% -42px; } #tabs10 a:hover span { background-position:100% -42px; } #tabs10 #current a { background-position:0% -42px; } #tabs10 #current a span { background-position:100% -42px; }
- Kemudian cari lagi kode berikut :
<b:section class='header' id='header' maxwidgets=' 1 ' showaddelement=' no '>
<b:widget id='Header1' locked=' true ' title='your blog title (Header)' type='Header'/>
</b:section>
- Kemudian ganti tulisan yang berwarna merah seperti berikut :
<b:section class='header' id='header' maxwidgets=' 2 ' showaddelement=' yes '>
<b:widget id='Header1' locked=' false ' title='your blog title (Header)' type='Header'/>
</b:section>
Lankah ke 2 :
- Ke Page Elements/Elemen laman > Add gadget/tambah gadget
- Pilih HTML/Java Script
- Copy paste code berikut :
<div id="tabs10"> <!-- tabs10 begin -->
<ul>
<!-- Change the links with your own links -->
<li id="current"><a href="URL Anda"> <span> Home </span></a> </li>
<li><a href="URL Anda"<span>Tutorial Blog</span></a></li>
<li><a href="URL Anda"><span>Registry XP</span></a></li>
<li><a href="URL Anda"><span>My Blog</span></a></li>
<li><a href="URL Anda"><span>Source Code</span></a></li>
<li><a href="URL Anda"><span>Download</span></a></li>
</ul>
</div ><!-- tabs10 end -->
- Tinggal di SAVE sobat lihat hasilnya...
Semoga bermanfaat !!! kurang jelas silahkan ke tutorial lengkapnya disini....