Cara Mudah Membuat Multi Tab Menu FastClean di Blog

Cara Mudah Membuat Multi Tab Menu FastClean di Blog

Memasang Multi Tab Menu atau biasa disebut menu 3 kolom adalah trik jitu untuk menghemat space di blog. Bayangkan saja anda memiliki keinginan memasang berbagai widget di blog tapi anda bingung harus menaruhnya dimana.

Jaman sekarang itu serba cepat, orang tidak suka dengan blog yang memiliki loading lama dan terlalu banyak widget. Seperti yang sudah saya tulis diatas bahwa Multi Tab Menu ini sangat berguna untuk mempercepat loading blog.




 Fitur Fitur Multi Tab Menu ini :

• Tampilan simple minimalis
• Fast and Clean
• Tidak memberatkan blog
• Auto scrollable (Otomatis bisa di scrool)
•  Terdiri 3 kolom

 Nah langsung saja menuju Cara Mudah Membuat Multi Tab Menu di Blog (3 menu in 1 box) ini :

• Login ke blogger
• Klik blog kesayangan anda
• Tata Letak ->> Add Gagdget ->> Pilih HTML/Javascript
• Salin kode dibawah ini kedalamnya

<style type="text/css">
    div.TabTampil div.TTs
    {height: 24px; overflow: hidden; }
    div.TabTampil div.TTs a:hover, div.TabTampil div.TTs a.Active
    { background-color: #eee; }
    div.TabTampil div.Halamans
    { clear: both; border: 1px solid #fff; overflow: hidden; background-color: #ffffff;}
    div.TabTampil div.Halamans div.Halaman
    { height: 100%; padding: 0px; overflow: hidden; }
    div.TabTampil div.Halamans div.Halaman div.Alas
    { padding: 3px 5px; }
    div.TabTampil div.TTs a
    { border-left:1px solid #eee; border-right:1px solid #eee; border-top:1px solid #eee; border-bottom:0px solid #eee; float: left;
    display: block; width: 95px; text-align: center; vertical-align: middle; height: 24px; padding-top: 3px; text-decoration: none; font-family: "Arial", Serif;
    font-size: 11px; font-weight: 900; color: #000000}
    </style>
    <form action="tabtampil.html" method="get">
    <div id="TabTampil" class="TabTampil">
    <div style="width: 300px;" class="TTs"> <a>JUDULTAB1</a> <a>JUDULTAB2</a> <a>JUDULTAB3</a></div>
    <div style="width: 300px; height: 300px;" class="Halamans">
    <div class="Halaman">
    <div class="Alas">
    <br/>

ISIKAN DENGAN KONTEN APAPUN DI TAB 1 INI

    </div>
    </div>
    <div class="Halaman">
    <div class="Alas">
    <br/>

  ISIKAN DENGAN KONTEN APAPUN DI TAB 2 INI

    </div>
    </div>
    <div class="Halaman">
    <div class="Alas">
    <br/>

   ISIKAN DENGAN KONTEN APAPUN DI TAB 3 INI

    </div>
    </div>
    </div>
    </div>
    </form>
    <script type="text/javascript">tabtampil_inisial('TabTampil');</script>

NOTE :

• Yang berwarna merah silakan ganti dengan judul yang akan sobat pakai di tampilan widget ini.
• Yang Pink silakan isi dengan konten apapun. Bisa widget atau apapun terserah anda :)

KLIK SAVE! Nah gunakan Fitur Multi Tab Menu FastClean ini dengan bijak :) Selamat mencoba

Yuk ikutan kontes seo, hadiahnya lumayan loh 100jt Klik link berikut Kontes SEO IDdetik.com

Tweet