- Login ke dashboard blog kamu.
- Pilih Rancangan »» Edit HTML
- Download template lengkap dulu untuk berjaga-jaga kalau terjadi kesalahan.
- Beri tanda ceklist pada Expand widget template.
- kemudian copy dan paste script berikut diatas ]]></b:skin> div.TabView div.Tabs { height:24px; overflow:hidden;} div.TabView div.Tabs a { float:left; display:block; width:90px; text-align:center; height:24px; padding-top:3px; vertical-align:middle; border:1px solid #ddd; border-bottom-width:0; text-decoration:none; font-family:verdana,arial,sans-serif; font-weight:bold; color:#000;} div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active {background-color:#fff;} div.TabView div.Pages {clear:both; border:1px solid #ddd; overflow:hidden; background-color:#fff;} div.TabView div.Pages div.Page {height:100%; padding:0px; overflow:hidden;} div.TabView div.Pages div.Page div.Pad {padding:3px 5px;}
- Selanjutnya copy dan paste script berikut diatas </head> <script src='http://blogtegal.googlecode.com/files/tabview.js' type='text/javascript'/>
- SIMPAN
- Selanjutnya tambah gadget berikut. Masuk ke menu rancangan --> klik ''Tambah Gadget'' dan pilih widget ''HTML/Javascript'' dan masukan kode berikut kedalamnya: <form action="tabview.html" method="get"> <div class="TabView" id="TabView"> <div class="Tabs" style="width:350px;"> <a>Sub judul 1 </a> <a>Sub judul 2 </a> <a>Sub judul 3 </a> </div> <div class="Pages" style="width:350px; height:260px;"> <div class="Page"> <div class="Pad"> Link 1 di menu 1 Link 2 di menu 1 Link 3 di menu 1 </div> </div> <div class="Page"> <div class="Pad"> Link 1 di menu 2 Link 2 di menu 2 Link 3 di menu 2 </div> </div> <div class="Page"> <div class="Pad"> Link 1 di menu 3 Link 2 di menu 3 Link 3 di menu 3 </div> </div> </div> </div> </form> <script type="text/javascript"> tabview_initialize ('TabView'); </script>
- SIMPAN.
Selasa, 20 Maret 2012
Cara membuat tab view
Cara membuat menu tab view
Langganan:
Posting Komentar (Atom)
Tidak ada komentar:
Posting Komentar