Kumpulan Trick Blog TErbaru

About

New Trick hayalah blog kecil yang mencoba untuk memberikan dan menyajikan trick dan tips tentang blog
Jumat, 15 Januari 2016

Cara Membuat Tiga Kolom Widget Dibawah Header

Cara Membuat Tiga Kolom Widget Dibawah Header ini sudah tidak ada uraian khusus lagi, cara membuatnya juga sama dengan membuat dua kolom widget dan kita langsung saja pada penerapan dari artikel ini, yaitu cara membuat tiga kolom widget dibawah header

Cara Membuat Tiga Kolom Widget Dibawah Header

Berikut Cara Membuat Dua Kolom Widget Dibawah Header
  1. Masuk ke akun blogger sobat
  2. Klik menu Template >> Edit Html >> tekan Ctrl+F pada keyboard sobat
  3. Cari kode ]]></b:skin>
  4. Letakkan kode berikut diatas kode ]]></b:skin>
    #triunderheader {clear:both;} .triwidget {}
  5. Cari kode <div id='main-wrapper'>
  6. Letakkan kode berikut ini tepat diatas kode <div id='main-wrapper'>
    <div id='triunderheader'>
    <div id='kolom1' style='width: 35%; float: left; margin:0; text-align: left;'>
    <b:section class='header' id='kolom1' preferred='yes' style='float:left;'/>
    </div>
    <div id='kolom2' style='width: 35%; float: center; margin:0; text-align: left;'>
    <b:section class='header' id='kolom2' preferred='yes' style='float:center;'/>
    </div>
    <div id='kolom3' style='width: 30%; float: right; margin:0; text-align: left;'>
    <b:section class='header' id='kolom3' preferred='yes' style='float:right;'/>
    </div>
    </div>
  7. Klik Pratinjau terlebih dahulu untuk melihat hasilnya, jika tidak ada error silahkan Simpan Template sobat dan lihat hasilnya di Tata Letak
Penting: Setiap template memiliki kode-kode css atau id html yang berbeda jadi sesuaikan setiap kode yang sobat miliki dengan setiap panduan yang sobat dapatkan atau sesuaikan setiap kode panduan dengan kode yang ada ditemplate sobat

Semoga artikel cara membuat tiga kolom widget dibawah header ini bermnafaat. Jika ada permasalahan dalam memasang kode, silahkan tinggalkan komentar sobat di artikel ini, cara membuat tiga kolom widget dibawah header




Klik untuk melihat kode: :) =( :s :D :-D ^:D ^o^ 7:( :Q :p T_T @@, :-a :W *fck* x@

TOP