Menu Tab View Versi 2

1. Login dahulu keblogger
2. Pilih tab Design >> Edit HTML
3. Cari kode ]]></b:skin>
4. Copy dan pastekan kode di bawah ini tepat di atas kode tadi

.tabs-widget{list-style:none;list-style-type:none;margin:0 0 10px 0;padding:0;height:26px}
.tabs-widget li{list-style:none;list-style-type:none;margin:0 0 0 4px;padding:0;float:left}
.tabs-widget li:first-child{margin:0}
.tabs-widget li a{color:#fff;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAKbP7za6R9SBw4UpvGNa2WAsvNreYLfAydFWV1GoMjs4q9_2ehFuS-cNmWBN68IBDBrDzw5HrNAJZ1Ad-q73rjUPkw1HBe7xI8AD3i9qn-qqJGZhP1nLSt_FLLBuUKIEC4fK4QE-FvVo/s1600/tabs-bg.png) left top repeat-x;padding:5px 10px;font-family:Arial,Helvetica,Sans-serif;font-weight:normal;display:block;text-decoration:none;font-size:12px;-moz-border-radius:5px 5px 0 0;-khtml-border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;}
.tabs-widget li a:hover,.tabs-widget li a.tabs-widget-current{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAKbP7za6R9SBw4UpvGNa2WAsvNreYLfAydFWV1GoMjs4q9_2ehFuS-cNmWBN68IBDBrDzw5HrNAJZ1Ad-q73rjUPkw1HBe7xI8AD3i9qn-qqJGZhP1nLSt_FLLBuUKIEC4fK4QE-FvVo/s1600/tabs-bg.png) left -126px repeat-x;color:#fff;text-decoration:none}
.tabs-widget-content{background:#fff;}
.tabviewsection{margin-top:10px;margin-bottom:2px;}

5. Tambah kode di bawah ini tepat di bawah kode ]]></b:skin>

<script type='text/javascript'>
var starttab=0;
var endtab=3;
var sidebarname=&quot;sidebar1&quot;;
</script>
<script src='http://andreas-jquery.googlecode.com/files/jquery-1.4.1.min.js' type='text/javascript'/>

6. Cari kode <b:section class='sidebar' id='sidebar' preferred='yes'>
7 Pastekan kode di bawah ini tepat di atas kode <b:section class='sidebar' id='sidebar' preferred='yes'>

<div class='tabviewsection'>

<script type='text/javascript'>
jQuery(document).ready(function($){
$(&quot;.tabs-widget-content-widget-themater_tabs-1432447472-id&quot;).hide();
$(&quot;ul.tabs-widget-widget-themater_tabs-1432447472-id li:first a&quot;).addClass(&quot;tabs-widget-current&quot;).show();
$(&quot;.tabs-widget-content-widget-themater_tabs-1432447472-id:first&quot;).show();

$(&quot;ul.tabs-widget-widget-themater_tabs-1432447472-id li a&quot;).click(function() {
$(&quot;ul.tabs-widget-widget-themater_tabs-1432447472-id li a&quot;).removeClass(&quot;tabs-widget-current a&quot;);
$(this).addClass(&quot;tabs-widget-current&quot;);
$(&quot;.tabs-widget-content-widget-themater_tabs-1432447472-id&quot;).hide();
var activeTab = $(this).attr(&quot;href&quot;);
$(activeTab).fadeIn();
return false;
});
});
</script>

<ul class='tabs-widget tabs-widget-widget-themater_tabs-1432447472-id'>
<li><a href='#widget-themater_tabs-1432447472-id1'>Videos</a></li>
<li><a href='#widget-themater_tabs-1432447472-id2'>Tags</a></li>
<li><a href='#widget-themater_tabs-1432447472-id3'>Blog Archives</a></li>
</ul>

<div class='tabs-widget-content tabs-widget-content-widget-themater_tabs-1432447472-id' id='widget-themater_tabs-1432447472-id1'>
<b:section class='sidebar' id='sidebartab1' preferred='yes'/>
</div>

<div class='tabs-widget-content tabs-widget-content-widget-themater_tabs-1432447472-id' id='widget-themater_tabs-1432447472-id2'>
<b:section class='sidebar' id='sidebartab2' preferred='yes'/>
</div>

<div class='tabs-widget-content tabs-widget-content-widget-themater_tabs-1432447472-id' id='widget-themater_tabs-1432447472-id3'>
<b:section class='sidebar' id='sidebartab3' preferred='yes'/>
</div>

</div>

8. Simpan (save) dan lihat hasilnya