Membuat Tab View dengan Mudah

Assalamualaikum, sesuai judulnya saya akan berbagi cara membuat Tab View sangat mudah tanpa edit sedikitpun, langsung saja caranya.

  1. Login ke blogger
  2. Pilih tata letak, tambah gadget, pilih html/javascript
  3. Masukkan kode dibawah ini
<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; /*--Pull tab down 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; /*--"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><br /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script><br /> <script type="text/javascript" src="http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bloggertabs0.1_min.js"></script><br /> <script type="text/javascript"> $(document).ready(function() { $('#codeholder').bloggerTabber ({ tabCount : 3 }); }); </script><br /> <!-- to make sure the widget works, do not alter the code below --><br /> <div id='codeholder'><p><a href="http://www.bloggersentral.com/2011/05/create-tabbed-content-blogger-widgets.html" target="_blank"></a></p></div>
      4. Simpan
      5. Kemudian taruh gadget yang akan dimasukkan dalam Tab View dibawah gadget yang baru kita buat
      6. Tab View langsung jadi
Mudah bukan? sekian dari saya, terima kasih
wassalamualaikum
referensi

CONVERSATION

0 komentar:

Post a Comment

Silahkan berkomentar sesuai kesan anda, tetapi jangan tinggalkan norma-norma kesopanan. Syukron