CARA MERUBAH BLOG MENJADI TIGA KOLOM

Hai semua pa kabar nee.... Dah lama gak posting kangen juga ya,,,, hari ini saya akan membahas tentang bagaimana caranya membuat blog kita menjadi tiga kolom satu tempat posting dan dua tempat sidebar, agar terlihat lebih gimana gitu hehehe....bukannya sok tahu sih malu akh sama yang udah pakar heempt.... Bagi para pemblogger baru jangan kuwatir sama seperti aku juga baru... habiz sekian lama sibuk gimana caranya agar cepet diapprove oleh mbah adsense jadi lupa posting deh,,, sory yaa, tapi Al-Hamdulillah sekarang sudah ada meski baru adsense Indonesia tak apalah. Upz kog jadi bahas tentang adsense sih melencong dari topik donk. Lain waktu deh kita bahas tentang adsense oke oke oke????

Langsung aja kita kembali ke topik eemmm.... cara kita membuat blog menjadi tiga kolom pertama-tama adalah kita harus tahu tentang literatur blog kita etz ngomongnya kayak dah canggih aja hehehe... salah lagi maksudnya kita harus mengetahui tentang outer-wrapper, widht, main, sidebar and header footer. Trus bagaimana caranya agar kita tahu nama-nama itu semua????

Langkah-langkahnya sebagai berikut:

1. Masuk ke blog kalian kemudian klik layout terus klik adit HTML.
2. Cari kode berikut ini #outer-wrapper {  position:relative;  top:0px;  $startSide:5px;  background: #cccccc;  width:660px;  margin:10px;  text-align:$startSide;  font: $bodyFont; }.
3. Perlu diketahui widht ini adalah lebar dari keseluruhan outer-wrapper, jadi jika disitu widhtnya 660px maka kita bisa merubahnya sesuai yang kita mau misal; widhtnya kita rubah menjadi 980px seperti punya saya, maka header footernya pun juga harus dirubah menjadi 980px, untuk main 500px dan kedua sidebar 200pxsisanya untuk margin, padding dan yang lainnya.
4. Kita mulai merubah kolom posting  #main-wrapper {  background: $mainBgColor url("http://www.blogblog.com/no565/corner_main_$startSide.gif") no-repeat; $endSide top;  width:410px;  float:$startSide;left;  color:$mainTextColor;  font-size: 85%;  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 */}. Ganti widhtnya dengan 500px (yang huruf merah).
5. Kemudian kita merubah kolom sidebar #sidebar1-wrapper {  background: $sidebarBgColor url("http://www2.blogblog.com/no565/corner_sidebar1_$startSide.gif") no-repeat $startSide top;0; width:220px;  float:$startSide;right;  padding:0;  color: $sidebarTextColor;  font-size: 83%; 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 */}. Ganti widhtnya dengan 200px (yang huruf merah).
6. Selanjutnya kita menambah satu sidebar lagi sesuai dengan judul posting dengan meletakkan kode berikut #sidebar2-wrapper {  background: $sidebarBgColor url("http://www2.blogblog.com/no565/corner_sidebar1_$startSide.gif") no-repeat $startSide top;0; width:200px;  float:$startSide;right;  padding:0;  color: $sidebarTextColor;  font-size: 83%; 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 */}. Diatas kode #main-wrapper. Atau kalian bisa copas sidebar yang ada di HTML kalian masing-masing, karena setiap template kita itu berbeda-beda. Dan untuk angka 2 itu hanya sebagai tanda saja untuk membedakan sidebar yang sudah ada.