Menambah 2 Sidebar di Bawah Sidebar Utama

Ehmm...... saya sedang berpikir kata-kata apa yang bagus untuk postingan ini hehe. Yasudahlah tidak usah basa-basi ya? saya yakin kalian sudah tau maksud posting ini, kalau engga tau coba lihat gambar ini saja biar saya engga usah jelasin hehehe

Nah kalau beginikan semuanya langsung mengerti, iyakan? haha. Oke langsung saja ke cara pembuatannya. Step.By.Step :

1. Login ke blog anda
2. Masuk ke Rancangan > Edit HTML
3. Cari kode berikut. kode mungkin berbeda, tapi coba fokuskan pencarian dengan kode paling atas
#sidebar-wrapper {
  width: 49%;
  float: $endSide;
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}
4. Sekarang hapus semua kode seperti di atas dan ganti dengan kode ini
#sidebar-wrapper {
  width: 49%;
  float: $endSide;
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}
#right-wrapper {
  width: 50%;
  float: right;
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}
#left-wrapper {
  width: 50%;
  float: left;
  word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
  overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
}
Jika anda mengerti anda bisa utak-atik kode di atas, tapi jika tidak mengerti sebaiknya diamkan saja.

5. Sekarang cari kode berikut (fokuskan pencarian ke kode yang paling atas)
<div id='sidebar-wrapper'>
        <b:section class='sidebar' id='sidebar' preferred='yes'>
..........
</b:section>
</div>
6. Letakan kode berikut sebelum kode warna merah yang ke-2
<div id='left-wrapper'>
        <b:section class='sidebar' id='left' preferred='yes'></b:section>
      </div>
<div id='right-wrapper'>
        <b:section class='sidebar' id='right' preferred='yes'></b:section>
      </div>
7. Save Templates

Semoga bermanfaat, silahkan tinggalkan komentar di bawah ini sebagai kritik dan saran untuk saya terima kasih

2 komentar:

Umar Fauzi MZ, 25 September 2010 at 09:07 | [Reply]

Nice info gan :)

Anonymous, 18 February 2011 at 00:43 | [Reply]

cobain ah

Post a Comment

Kotak Komentar Klasik Klik Di sini

« Prev Next » Home