Menu tab view ini adalah untuk menghemat space blog sobat sehingga bisa memaksimalkan tampilan blog.
Cara membuat menu tab view
1. Login ke dashboard blog kamu.
2. Pilih Rancangan »» Edit HTML
3. Download template lengkap dulu untuk berjaga-jaga kalau terjadi kesalahan.
4. Beri tanda ceklist pada Expand widget template.
5. 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;}
6. Selanjutnya copy dan paste script berikut diatas </head>
<script src='http://blogtegal.googlecode.com/files/tabview.js' type='text/javascript'/>
7. SIMPAN
8. 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>
9. SIMPAN.