Cara mengganti background sidebar

Ada dua cara untuk mengganti background, baik pada sidebar, header, body dll yaitu dengan menggunakan warna dan gambar. Tapi pada kesempatan kali ini saya akan mencoba berbagi tentang mengganti background sidebar. pertama-tama tentunya yang kita perlukan adalah:

I. Gambar

Silahkan siapkan gambar yang sesuai dengan selera anda setelah itu upload ke dalam hosting blog. jika tidak memiliki hosting sendiri anda bisa upload menggunakan picasa.google.com atau photobucket.com dll.

II. Warna

untuk warna anda bisa melihatnya di bagian penyesuaian template blog kita atau anda dapat lihat di sini.

III. Makrup

Juga makrup yang mungkin pada beberapa tempale tidak ditemukan dikarnakan setiap template berbeda.


Makrup

Kotak

.sidebar {
}

Judul

.sidebar h2 {
}

Isi

.sidebar .widget-content {
}

Pemasangan

1. Login/masuk ke blog
2. Pilih template kemudian Edit HTML
3. Setelah muncul jendela baru centang Expand Template Widget
4. Cari element, gunakan CTRL+F untuk memudahkan pencarian. Jika anda tidak menemukan makrup-makrup di atas silahkan anda tambahkan saja di dalam template. misalnya:

.sidebar h2 {
}

kemudian tambahkan attribut:

background:url(#)repeat-x;

sebelum tanda } , sehingga menjadi

.sidebar h2 {
 background:url(#)repeat-x;
}

ganti url(#)repeat-x dengan kode warna yang sesuai dengan kenginan anda atau jika anda mengunakan gambar ganti # dengan menggunakan direct link atau URL gambar yang sebelumnya telah kita di-upload. Misalnya:

http://i1309.photobucket.com/albums/s639/hendra1089/overlay_zps21d58a52.png

sehingga menjadi

.sidebar h2 {
 background: #f6b26;
}

jika menggunakan kode warna #f6b26b, atau

.sidebar h2 {
 background:url(http://i1309.photobucket.com/albums/s639/hendra1089/overlay_zps21d58a52.png) repeat-x;
}

kemudian letakan tepat di atas kode

]]><b:skin>

5. Pertinjau template kemudian
6. Terakhir Simpan

selamat mencoba, semoga berhasil!