Membagi Sidebar Menjadi Dua kolom

Sunday, June 6, 2010
Berikut ini adalah catatan mengenai cara membagi sidebar template minima blogger menjadi dua kolom.

A. Langkah I

1. Log in ke akun blogger.

2. Setelah masuk ke akun blogger, kemudian klik menu "Rancangan" atau "Design"

3. Klik "Page Element" atau "Elemen Laman" dan back-up semua gadget / widget sidebar yang perlu di back-up.

4. Klik "Edit HTML" untuk masuk ke halaman pengeditan kode template (setelah back-up selesai).

5. Centang kotak kecil yang berada di sebelah kiri kalimat "Expand template widget" kemudian back up (copy paste) seluruh kode template di notepad. Untuk berjaga-jaga jika terjadi kesalahan dalam pengeditan kode template.

6. Copy semua kode berikut ini :

#sidebar-wrapper{
width:220px;
float:right;
word-wrap:break-word;
overflow:hidden;
}

#left-side{
width:50%;
float:left;
word-wrap:break-word;
overflow:hidden;
}

#right-side{
width:50%;
float:right;
word-wrap:break-word;
overflow:hidden;
}

7. Temukan kode berikut ini atau yang mirip dengan kode berikut ini dan ganti dengan kode diatas :

#sidebar-wrapper {
  width: 220px;
  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 */
}

Langkah I selesai. Sekarang lakukanlah langkah-langkah berikut ini untuk menyempurnakannya.

B. Langkah II

1. Hilangkan tanda centang pada kotak yang ada disebelah kiri kalimat "Expand template widget". Hal ini dilakukan agar tidak terlalu rumit.

2. Temukan kode berikut ini atau yang mirip dengan kode berikut :

        <div id='sidebar-wrapper'>
        <b:section class='sidebar' id='sidebar' preferred='yes'>
        </b:section>
        </div>

3. Ganti semua kode diatas dengan kode berikut ini:

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='left-side' preferred='yes' showaddelement='yes'>
</b:section>
<b:section class='sidebar' id='right-side' preferred='yes' showaddelement='yes'>
</b:section>
</div>

4. Klik "Simpan" atau "Save" setelah hasilnya sesuai yang diinginkan.
5. Klik "Page Element" atau "Elemen Laman" untuk melihat hasilnya.
6. Jangan lupa Sign out jika sudah tidak ada lagi urusan dengan editing blogspot. Jaga-jaga kalau ada orang nyasar.
7. Selesai.

Semoga bermanfaat..  

Comments :

0 komentar ke "Membagi Sidebar Menjadi Dua kolom"


Post a Comment

Silakan berkomentar sesuka Anda. Namun jangan spam, berbau SARA, kekerasan, porno atau intimidasi terhadap orang lain. Komentar yang melewati batas akan di hapus. Terima kasih.

Get Update

Masukkan alamat e-mail Anda pada kotak di bawah ini untuk mendapatkan update terbaru dan berlangganan catatan dari blog "The Notes Web" via e-mail :


Privacy guaranteed, we will never share your e-mail.

Komentar terbaru

Catatan Terbaru

Komentar Terbaru