Memperlebar Halaman Blog

Ketika saya membuat blog dengan template yang tersedia,, terkadang lebar blog tidak sesuai dengan keinginan kita..
atau ketika kita akan menambahkan kolom baru untuk blog..(akan dibahas nanti..)
oleh karena itu kita mesti melebarkan ukuran blog terlebih dahulu..

Untuk melebar Blog kita.. kita harus tau dahulu tentang Header, Main,sidebar dan footer..
Penjelasan :
#outer-wrapper --> kode untuk lebar halaman blog.
#header-wrapper --> kode untuk lebar kepala Blog/gambar blog.
#main-wrapper --> kode untuk lebar postingan blog.
#sidebar-wrapper --> kode untuk lebar sidebar blog.
#Footer Header --> kode untuk bagian bawah blog.

nah sudah mengerti kan bagian-bagian tersebut..
Sebelum kita memulainya kita harus hitung-hitungan dahulu..
Pokoknya lebar dari
Outer=Header=footer=main+sidebar+Spasi*
*Spasi= jarak antara bisa berapa aja.. biasanya 20 hingga 50

setelah menentukan dan berhitung, kita memperoleh..
Outer=Header=Footer= 950px
Main= 600px
Sidebar= 300px
spasi= 50 px

Maka sekarang kita mulai rubah scriptnya..
caranya...
1. Masuk Tata letak dan ke edit HTML..
2. Centang tanda expand template widget
3. Cari Script #outer-wrapper (gunakan Fungsi Find windows.. Ctrl+f)
4. Lihat kode dibawah ini..
#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}

#main-wrapper {
width: 410px;
float: $startSide;
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: 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 */
}
5. Ubah angka-angka yang bertanda merah berikut dengan ukuran yang telah kita hitung tadi...
#outer-wrapper {
width: 950px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}

#main-wrapper {
width: 600px;
float: $startSide;
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: 300px;
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 */
}
Sampai disini ukuran halaman blog kita sebenarnya sudah berubah.. akan tetapi masih blom rapih karena header dan footernya tidak sesuai.. untuk mengatur header dan footer caranya sama seperti diatas, cari #Header-wrapper dan #footer-wrapper, dan kemudian ubah ukuran pikselnya...

Oke,, sampai disini dulu,,

Selamat mengeblog..

________________________________________________________________
-------------------------------------------------------------------------------------------------------
Blog kita dikunjungin,, kita dapat dollar di uu9.eu..
klik disini untuk ikutan.. atau baca disini untuk lebih lanjut..
________________________________________________________________
-------------------------------------------------------------------------------------------------------
Ingin meningkatkan trafic blog dan penghasilan anda dengan easyhits4u.com klik disini..
Atau untuk baca lebih lengkapnya baca disini..
________________________________________________________________
-------------------------------------------------------------------------------------------------------