Senin, 08 Juni 2009

Mengubah lebar template blog

clip_image001
Mengubah lebar template blog. Mungkin ada diantara kawan-kawan yang menggunakan template default dari blogger. Umumnya template tersebut mempunyai tampilan yang kurang lebar. Berikut ini adalah cara ubah lebar template blog (dalam contoh ini saya menggunakan template : Denim). Mungkin jika menggunakan template lain source templatenya agak berbeda.
clip_image002
Untuk mengubah lebar tampilan blog, prosedur yang anda lakukan adalah:
1. masuk ke dashboard -> Tata letak -> Edit Html
Kemudian centang " Expand widget Templates"
(Catatan: sebelum mengubah kode berikut, lakukan backup template agar jika gagal anda bisa mengembalikan ke kondisi template awal)
clip_image003
2. Selanjutnya cari kode berikut:
a. mengubah lebar header
(pada bagian width : ubah menjadi 880px)
#header {
width: 880px;
margin: 0 auto;
background-color: $headerBgColor;
border: 1px solid $headerBgColor;
color: $headerTextColor;
padding: 0;
font: $headerFont;
b. Kemudian mengubah lebar bagian konten (content)
(pada bagian with : ubah menjadi 880px)
#content-wrapper {
width: 880px;
margin: 0 auto;
padding: 0 0 15px;
text-align: $startSide;
background-color: $mainBgColor;
border: 1px solid $borderColor;
border-top: 0;
c. Mengubah lebar ruang postingan
Pada bagian width ubah menjadi 550px
#main-wrapper {
margin-$startSide: 14px;
width: 550px;
float: $startSide;
background-color: $mainBgColor;
display: inline;
d. Mengubah lebar sidebar
Ubah ukuran width menjadi 280px
#sidebar-wrapper {
margin-$endSide: 14px;
width: 280px;
float: $endSide;
background-color: $mainBgColor;
display: inline;
Setelah kode di atas selesai di edit, klik tombol Simpan Template
Apabila sudah tersimpan bisa lihat perubahannya pada blog anda.
Anda bisa berkreasi mengubah lebar blog anda sesuai keinginan, dengan catatan:
1. Lebar header harus sama dengan lebar konten (content)
2. Lebar ruang postingan ditambah lebar sidebar harus lebih kecil dari lebar header.

0 komentar:

Posting Komentar

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Blogger Templates