Pada postingan sebelumnya kita membahas cara menambah sidebar. Postingan kali ini akan memaparkan cara-cara untuk mengubah kolom pada templat (header wrapper, outer wrapper, main wrapper, sidebar wrapper dan sidebar baru wrapper)
Caranya tidak sulit, anda hanya tinggal mengganti angka-angka pada kolom template yang ingin diubah lebarnya.
Kita langsung ke kode HTML untuk mengubah angka-angka pada kolom teplate. Sebagai contoh, dibawah ini merupakan ukuran kolom template yang digunakan dalam Blog EPG Studio. Silahkan anda simak.
Dalam pengaturan ukuran kolom template,lebarnya harus disesuaikan dengan dengan lebar header wrapper/outer wrapper (dalam px=pixel) dari contoh diatas memiliki lebar 990px. Dalam pengaturan berikutnya jumlah dari lebar : main wrapper, sidebar wrapper dan sidebar baru wrapper harus berjumlah 990px (sama dengan lebar header wrapper/outer wrapper)
Untuk lebih jelasnya kita lihat perinciannya :
Setelah selesai mengotak-atik angka pada kolom template, klik Simpan Template
Lihat Blog anda yang baru...!!!
Caranya tidak sulit, anda hanya tinggal mengganti angka-angka pada kolom template yang ingin diubah lebarnya.
Kita langsung ke kode HTML untuk mengubah angka-angka pada kolom teplate. Sebagai contoh, dibawah ini merupakan ukuran kolom template yang digunakan dalam Blog EPG Studio. Silahkan anda simak.
- Masuk ke Blogger
- Pilih Rancangan bagian Edit HTML
- Cari kode seperti dibawah ini
- Ingat kode contoh yang ditampilkan merupakan kode dari Template Tata Letak. Jadi kalau kode yang anda cari tidak ketemu berarti templatenya berbeda
/* Header
-----------------------------------------------
*/
#header-wrapper {
width:990px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
#outer-wrapper {
width: 990px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
#main-wrapper {
width: 480px;
float:$startSide;background:#C3D9FF;border:0pxsolid $bordercolor;#0066cc;padding:15px 15px .25em;
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: 260px;
float: $endSide;background:#0066CC; border:0px solid $bordercolor;white; padding:5px 5px .25em;
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 */
}
#sidebarbaru-wrapper {
width: 200px;
float: left;background:#0066CC; border:0px solid $bordercolor;white; padding:5px 5px .25em;
psdding-right:5px;
word-wrap: break-word;
overflow: hidden;
}
Dalam pengaturan ukuran kolom template,lebarnya harus disesuaikan dengan dengan lebar header wrapper/outer wrapper (dalam px=pixel) dari contoh diatas memiliki lebar 990px. Dalam pengaturan berikutnya jumlah dari lebar : main wrapper, sidebar wrapper dan sidebar baru wrapper harus berjumlah 990px (sama dengan lebar header wrapper/outer wrapper)
Untuk lebih jelasnya kita lihat perinciannya :
- Lebar Main wrapper = 480px, padding = 15px+15px=30px, jumlah 510px
- Lebar Sidebar wrapper = 260px, padding = 5px+5px=10px, jumlah = 270px
- Lebar sidebar baru wrapper = 200px, padding = 5px+5px=10px, jumlah = 210px
- Lebar Main wrapper + sidebar wrapper + sidebar baru wrapper = 510px + 270px + 210px = 990px
Setelah selesai mengotak-atik angka pada kolom template, klik Simpan Template
Lihat Blog anda yang baru...!!!
Tidak ada komentar:
Posting Komentar