Bikin Sidebar di Sebelah Kiri Pada Template Blogspot/Blogger

---

---

---

---

Untuk menambah sidebar di sebelah kiri,
caranya adalah sebagai berikut:
1. Login ke Blogspot Edit HTML
2. Download templateuntuk jaga-jaga biar bila ada kesalahan dalam proses edit HTML, bisa dikembalikan lagi ke template awal.
3. Lihat di bagian Outer Wrapper, tambahkan kode Berwarna merah dan rubah beberapa variabel seperti dibawah ini:

/* Outer-Wrapper

----------------------------------------------- */

#outer-wrapper {

width: 840px;

margin:0 auto;

padding:10px;

text-align:left;

font: $bodyfont;

}

#main-wrapper {

width: 420px;

float: left;

padding: 5px;

border:1px solid $bordercolor;

background-color:#c77c7c;

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 */

}

#sidebar-wrapper {

width: 200px;

float: right;

padding: 5px;

border:1px solid $bordercolor;

background-color:#c77c7c;

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 */

} #newsidebar-wrapper {

width: 200px;

float: left;

padding-right:10px;

word-wrap: break-word;

overflow: hidden;

}

Catatan:
Outer wrapper merupakan lebar template, rubah angkanya seperti yang diinginkan; pada contoh diatas, lebarnya dari 660px dirubah jadi 840px.
Main wrapper adalah lebar kolom posting, pada contoh diatas lebarnya dari 410px diubah jadi 420px.
Sidebar wrapper adalah lebar sidebar yang dinginkan, pada contoh lebarnya dari 220px diubah jadi 200px.
Float menunjukan letak side bar di kiri atau dikanan.


4. Kemudian letakkan kode dibawah sebelum kode ini :
<div id="main-wrapper">

<div id="newsidebar-wrapper">

<b:section class="sidebar" id="newsidebar" preferred="yes">

5. Simpan.
Selamat mencoba.

---

---

---

Anda sedang membaca artikel tentang Bikin Sidebar di Sebelah Kiri Pada Template Blogspot/Blogger dan anda bisa menemukan artikel Bikin Sidebar di Sebelah Kiri Pada Template Blogspot/Blogger ini dengan url http://tutorial-blogs.blogspot.com/2011/04/bikin-sidebar-di-sebelah-kiri-pada.html,anda boleh menyebar luaskannya atau mengcopy paste-nya jika artikel Bikin Sidebar di Sebelah Kiri Pada Template Blogspot/Blogger ini sangat bermanfaat bagi teman-teman anda,namun jangan lupa untuk meletakkan link Bikin Sidebar di Sebelah Kiri Pada Template Blogspot/Blogger sebagai sumbernya.

---