Tutorial : Multiple Sidebar ( Template )

Assalamualaikum . Tadi aimi buat tutobies multiple tab untuk pengguna blogskin kan ? SINI untuk blogskin . Now , aimi buat multiple tab untuk pengguna template pulak . Tolong komen kalau dah menjadi or tanya lah kalau tak menjadi ye ? Okay , let's start ! ^^

contoh

1. Dashboard > Layout > Add a gadget > HTML/Javascript

2. Copy code di bawah ni

<style type="text/css">
    .tabber {
     padding: 0px !important;
     border: 0 solid #bbb !important;
    }
    .tabber h2 {
     float: left;
     margin: 0 1px 0 0;
     font-size: 12px;
     padding: 3px 5px;
     border: 1px solid #bbb;
     margin-bottom: -1px; /*--Pull tab down 1px--*/
     overflow: hidden;
     position: relative;
     background: #ffffff;
     cursor:pointer;
    }
    html .tabber h2.active {
     background: #BDBDBD;
     border-bottom: 1px solid #BDBDBD; /*--"Connect" active tab to its content--*/
    }
    .tabber .widget-content {
     border: 2px solid #BDBDBD;
     padding: 10px;
background: #fffffff;
     clear:both;
     margin:0;
    }
    .codewidget, #codeholder {
     display:none;
    }
    </style>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
    <script type="text/javascript" src="http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bloggertabs0.1_min.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
     $('#codeholder').bloggerTabber ({
      tabCount : 4     });
    });
    </script>
    <!-- to make sure the widget works, do not alter the code below -->
<div id='codeholder'><p>Get this <a href="http://www.bloggersentral.com/2011/05/create-tabbed-content-blogger-widgets.html" target="_blank">tabber widget</a></p></div>

3. Paste kan dalam HTML/Javascript tu

hijau  : colour background active tab & border bawah tab.
biru : kaler background sidebar.
merah : Bilangan tab.
ungu : kaler border tab.
oren : ketebalan & jenis border (dashed, dotted, solid)

HTML Colour Codes di >SINI<

4. Susun sidebar widget tu macam ini tau . Baru ia menjadi .

contoh

Credit to : AennAthirahblog