Latest News

Tips dan Trick Cara Membuat Widget Menu Tab Sederhana

Cara Membuat Widget Menu Tab Sederhana

Apik IMcyber

Friday, August 2, 2013

Selamat malam sobat blogger kli ini saya mau bagi cara bagaimana membuat tab view untuk widget blogger sobat, mungkin yang ingin membuat tab view untuk widget, yang jenis widgetnya hampir sama Contohnya seperti widget categori , post terpopuler / top pst dan post terbaru atau widget followers, fanspage fb dan widget widget lainnya,tentunya akan terlihat lebih rapih kalau kita kelompokan, oke langsung aja sob silahkan disimak tutornya :D

Cara Membuat Daftar Menu/Isi Di Sidebar Blog :

Login ke dashboard blogger sobat.
Pilih Tata Letak > Add gadget (HTML/JavaScript).
Copy script dibawah ini dan paste pada gadget.

<style type="text/css">
    .tabber {
     padding: 0px !important;
     border: 0 solid #transparan;
    }
    .tabber h2 {
     float: left;
     margin: 0 1px 0 0;
     font-size: 12px;
     padding: 3px 5px;
     border: 1px solid #fda352;
     margin-bottom: -1px; 
     overflow: hidden;
     position: relative;
     background: #575757;
     cursor:pointer;
     -moz-border-radius:0px 0px 0 0;
     border-radius:0px 0px 0 0;
    }
    html .tabber h2.active {
     background: #fda352;
     border-bottom: 1px solid #000;
    }
    .tabber .widget-content {
     border: 1px solid #fda352;
     padding: 10px;
     background: #transparan;
     clear:both;
     margin:0;
    }
    .codewidget, #codeholder {
     display:none; {
    </style><br />
<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><div id='codeholder'>
<a href="http://www.apikk.blogspot.com" target="_blank"></a><p>
<a href="http://apikk.blogspot.com/2013/08/widget-menu-tab-view-termudah-untuk.html" target="_blank"></a></p>
</div>

Apabila sudah di paste, kamu klik SIMPAN
Kemudian letakan widget widget yang akan di kumpulin dalam satu tab view, tepat dibawah widget yang telah di buat tadi untuk lebih jelasnya contonya seperti pada gambar di bawah
Kemudian Simpan perubahan dan lihat hasilnya :D

Stylenya silahkan edit sendiri gan :D

0 Response to " Cara Membuat Widget Menu Tab Sederhana "

Subscribe to: Post Comments ( Atom )