Tutorial Tabber Widget

Heyyo GG!

haritu, Nina ada minta zizie buatkan tutorial tabber widget macam zizie punya.



1. Pergi ke dashboard dan pilih menu layout.
2. Tekan Add A Gadget dan pilih HTML/Javascript.
3. Copy dan paste code di bawah.

<style type="text/css">
.tabber {
 padding: 0px !important;
 border: 0 solid #bbb !important;
}
.tabber h2 {
 float: center;
 margin: 1px 1px 0 0;
 font-size: 20px;
 padding: 3px;
 border: 1px solid #fff;
width:240px;
height:20px;
 margin-bottom: -1px; /*--Pull tab down 1px--*/
 overflow: hidden;
 position: relative;
 background: #0095FF;
 cursor:pointer;
}
html .tabber h2.active {
color: #fff;
background: #00DEFF; /*--"Connect" active tab to its content--*/
}
.tabber .widget-content {
 border: 1px solid #bbb;
 padding: 10px;
 background: #fff;
 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 : 5
 });
});
</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>

ketebalan,jenis dan warna border
lebar dan ketinggian tab. ikut ukuran yang sesuai dengan blog korang.
background sebelum dan selepas ditekan.
saiz tulisan. ( boleh juga ditambah jenis tulisan).
warna tulisan selepas ditekan.
bilangan tab.

4. save dan letakkan HTML/Javasript di atas tab yang ingin disusun.

selamat mencuba :)