Cara Memodif Template Agar Tampak Lebih Menarik

Perhatian :
Sebelum kamu melakukan perubahan, biasakanlah untuk selalu membackup template kamu terlebih dahulu, karena sesal kemudian tidak berguna :D sekali lagi saya peringatkan agar membackup template kamu yang lama...."Urgent" karena jika sudah tersave pada template yaung baru maka jangan harap kamu bisa balikin template kamu yang lama....

atribut background digunakan untuk memberikan latar belakang dengan warna ataupun dengan gambar.
Jika latar belakang berupa warna, maka dapat digunakan nama warna yang dapat dikenali oleh browser atau menggunakan #hex color.
jika latar belakang berupa gambar, maka terlebih dahulu kamu harus meng upload gambar kamu di salah satu hosting site pilihan kamu misal di http://photobucket.com lalu catat alamat URL dari gambar kamu, misal http://i123.photobucket/contoh/gambargue.jpg agar dapat digunakan pada saatnya kelak

Ok,

Login dulu ke dashboard-layout kamu --> pilih Edit HTML,
[ingat, backup dulu template yang sudah kamu miliki]

selanjutnya,
pada box edit template, carilah code berikut :

Code: Select all: body { background:$bgcolor;

[size=150]Mengubah warna background[/size]

Jika kamu ingin mengubah warna background blog kamu dengan warna yang unik, kamu bisa mengganti #hex value warna background kamu secara manual,
kamu bisa mampir [link=http://www.w3schools.com/html/html_colors.asp:1rgfvb60]kesini[/link:1rgfvb60] untuk mengetahui #hex color pilihan kamu.
contoh, kamu memilih warna hitam sebagai warna pilihan backgroundmu,
maka #hex colornya adalah #000000.

selanjutnya, ganti kode diatas menjadi :

Code: Select all: body { background-color: #000000;

Untuk mengubah warna background pada sidebar,
tambahkan #hex value nya disini :

Code: Select all: #sidebar-wrapper { background-color: #000000;

Untuk mengubah warna background pada main post column,
tambahkan #hex value nya disini :

Code: Select all: #main-wrapper { background-color: #000000;

catatan : untuk template yang berbeda, ada kemungkinan label stylesheetsnya berbeda pula,

#sidebar-wrapper bisa juga ditulis #side-wrap

[size=150]Menambahkan latar belakang berupa gambar[/size]

tambahkan alamat URL dari gambar kamu disini :

Code: Select all: body { background-image: url(URL address of your image);

pada sidebar tambahkan alamat URL dari gambar kamu disini :

Code: Select all: #sidebar-wrapper { background-image: url(URL address of your image);

pada main post column tambahkan alamat URL dari gambar kamu disini :

Code: Select all: #main-wrapper { background-image: url(URL address of your image);

Secara default, gambar background kamu akan ditampilkan secara berulang.

Jika kamu ingin menampilkan berulang secara horizontal, tambahkan kode berikut :

Code: Select all: background-repeat: repeat-x;

Jika kamu ingin menampilkan berulang secara vertical, tambahkan kode berikut :

Code: Select all: background-repeat: repeat-y;

Jika tidak ingin ditampilkan berulang, tambahkan kode berikut :

Code: Select all: background-repeat: no-repeat;

Kamu juga bisa mengatur gambar kamu dengan posisi tertentu,

Jika kamu ingin mengatur gambar kamu pada posisi kiri atas, tambahkan kode berikut :

Code: Select all: background-position: top left;

selanjutnya kamu bisa menggantinya dengan :

top center;
top right;
center left;
center center;
center right;
bottom left;
bottom center;
bottom right;

sesuai keinginan kamu

tambahkan juga kode berikut jika kamu menginginkan gambar latar belakang dapat di scroll :