Cara mudah membuat widget tab view yang dinamis dan simple

Kali ini gue ingin berbagi cara mudah membuat widget tab view yang dinamis dan simple. Kenapa saya bilang mudah,dinamis dan simple? karena cara pasangnya sangat mudah, dan hasilnya'pun sangat dinamis dan simple. contohnya bisa kamu lihat seperti gambar dibawah ini:

Okey,Jika anda tertarik dan ingin memasang widget tab view di situs/blog kamu, silahkan ikuti langkah - langkah dibawah ini:
1 .Berdoa dulu (menurut kepercayaan masing - masing).
2 .Login ke akun blog/situs yang anda kelola.
3 .Pilih Rancangan > Elemen Laman > Add gadget (HTML/JavaScript).
3 .Copy script dibawah ini dan paste pada gadget. Untuk meng'Copy silahkan tekan Select All Text, setelah itu tekan Ctrl + c di keybord kamu.

 <style type="text/css">     .tabber {      padding: 0px !important;      border: 0 solid #bbb;     }     .tabber h2 {      float: left;      margin: 0 1px 0 0;      font-size: 12px;      padding: 3px 5px;      border: 1px solid #bbb;      margin-bottom: -1px;      overflow: hidden;      position: relative;      background: #e0e0e0;      cursor:pointer;      -moz-border-radius:5px 5px 0 0;      border-radius:5px 5px 0 0;     }     html .tabber h2.active {      background: #fff;      border-bottom: 1px solid #fff;     }     .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 : 3      });     });     </script><!-- Jangan hapus kode dibawah, agar widget bisa berfungsi --><div id='codeholder'><a href="http://www.bloggersentral.com/2011/05/create-tabbed-content-blogger-widgets.html" target="_blank"></a><p>Get this <a href="http://dumiesforfun.blogspot.com/2012/11/cara-mudah-membuat-widget-tab-view-yang.html" target="_blank"><blink>widget</blink></a></p></div>

4 .Setelah kamu paste, di kolom widget Html/Java Script, silahkan kamu simpan/klik simpan/save.
5 .Apabila kamu sudah menambahkan kode menu tab view di atas, maka kamu cukup mengatur widget - widget mana yang ingin kamu masukan ke menu tab view, Dan cara penambahannya cukup simple dan mudah, taruh atau geser widget yang ingin kamu tambahkan ke bawah widget menu tab view tsb. silakan lihat gambar di bawah ini:

6 .Setelah kamu atur seperti gambar diatas, silahkan kamu simpan/klik save template dan setelah itu silahkan kamu lihat hasilnya.

Bagaimana hasilnya?? Mudah bukan???
Ket: tabCount : 3 , bisa kamu ubah sesuai dengan selera kamu. jika kamu ingin memasukan 4 tab, silahkan ganti tabCount : 3 menjadi tabCount : 4

Demikain tutorial cara mudah membuat widget tab view keren,simple dan dinamis.
Uda gue coba dan berhasil !!