Membuat dan Memasang Multi Tab 3 kolom




Membuat dan Memasang Multi Tab 3 kolom

Multi Tab, biasanya digunakan untuk meringkas ruangan yang umumnya dipasang disisi kiri atau kanan biasa disebut sidebar. Disusun dari mulai 3 kolom atau lebih. Kali ini akan disampaikan cara membuat multi tab 3 kolom yang dapat dari sobat Arlina.

Pilih blog sobat yang akan disematkan multi tab 3 kolom, lalu pilih TEMPLATE dan dilanjutkan dengan pilihan EDIT HTML. Setelah masuk pada area EDIT HTML carilah kode ]]></b:skin>, dan tempatkan kode di bawah ini di atas kode ]]></b:skin>

/* Multi Tab Widget */
.multitab-section{background:#fff;text-transform:uppercase;width:100%}
.multitab-widget{list-style:none;margin:0 0 10px;padding:0}
.multitab-widget li{list-style:none;padding:0;margin:0;float:left}
.multitab-widget li a{background:#22a1c4;color:#fff;display:block;padding:15px;font-size:13px;text-decoration:none}
.multitab-tab{border:0;width:33.3%;text-align:center}
.multitab-section h2,.multitab-section h3,.multitab-section h4,.multitab-section h5,.multitab-section h6 {display:none;}
.multitab-widget li a.multitab-widget-current{padding-bottom:20px;margin-top:-10px;background:#fff;color:#444;text-decoration:none;border-top:5px solid #22a1c4;font-size:14px;text-transform:capitalize}

Kemudian cari kode <div id='sidebar-wrapper'> dan tempatkan kode di bawah ini di bawah kode <div id='sidebar-wrapper'>

<div class='multitab-section'>
<ul class='multitab-widget multitab-widget-content-tabs-id'>
<li class='multitab-tab'><a href='#multicolumn-widget-id1'>Popular</a></li>
<li class='multitab-tab'><a href='#multicolumn-widget-id2'>Tags</a></li>
<li class='multitab-tab'><a href='#multicolumn-widget-id3'>Archive</a></li>
</ul>
<div class='multitab-widget-content multitab-widget-content-widget-id' id='multicolumn-widget-id1'>
<b:section class='sidebar' id='sidebartab1' preferred='yes'/>
</div>
<div class='multitab-widget-content multitab-widget-content-widget-id' id='multicolumn-widget-id2'>
<b:section class='sidebar' id='sidebartab2' preferred='yes'/>
</div>
<div class='multitab-widget-content multitab-widget-content-widget-id' id='multicolumn-widget-id3'>
<b:section class='sidebar' id='sidebartab3' preferred='yes'/>
</div>
</div>

"Popular", "Tags", dan "Archive" dapat diganti sesuai keinginan Anda.
</>


Previous


Next Post »
Berlangganan :
Masukan e-mail Anda untuk mendapatkan kiriman artikel terbaru dari langsung di pesan kotak masuk.
feedburner


Jangan lupa Jempolnya atau dishare ya.

Terima kasih, ditunggu kunjungan balik.
Cara style text di komentar Disqus:
  • Untuk menulis huruf bold silahkan gunakan <strong></strong> atau <b></b>.
  • Untuk menulis huruf italic silahkan gunakan <em></em> atau <i></i>.
  • Untuk menulis huruf underline silahkan gunakan <u></u>.
  • Untuk menulis huruf strikethrought silahkan gunakan <strike></strike>.
  • Untuk menulis kode HTML silahkan gunakan <code></code> atau <pre></pre> atau <pre><code></code></pre>, dan silahkan parse dulu kodenya pada kotak parser di bawah ini.
  • Untuk COPY - PASTE gunakan ctrl+C untuk copy dan ctrl+V untuk paste.

Rekomendasi Untuk Anda × +
Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

Tidak ada komentar