Cara Merubah Background Sidebar atau Gadget Blog Blogspot (2)

Sebenarnya, Membuat atau merubah background yang "berlaku" untuk semua sidebar atau gadget ini memiliki prinsip kerja yang sama pada postingan sebelumnya (klik link ini Merubah Background Sidebar atau Gadget Blog Blogspot). Hanya saja, ini akan berefek untuk semua sidebar atau gadget. Oke, langsung saja ke TKP

Kembali saya ulang, sidebar memiliki 3 komponen, yaitu  yang harus diketahui:

1. Tempat berpijahnya sidebar (aku bingung milih katah yang tepat, wkwkwk). Intinya, "tempat berpijah" ini adalah komponen paling luar dari gadget.
2. Judul sidebar
3. Isi sidebar

Dari ketiga komponen tersebut, masing-masing dapat diberi background, apakah itu backround warna atau background gambar. Saya sendiri lebih memilih "bermain" warna, selain tidak punya skill membuat gambar (hahaha), ini juga mempengaruhi kecepatan loading blog (ini akan sangat terasa jika menggunakan modem yang super lemotttttt)

Untuk merubah background "tempat berpijah" Sidebar, silahkan cari kode berikut:
#sidebar-wrapper {    ATAU    .sidebar-wrapper {

Untuk merubah background "judul" Sidebar, silahkan cari kode berikut:
.sidebar h2 {    ATAU   .sidebar h2{    ATAU    #sidebar h2 {

Untuk merubah background "Isi" Sidebar, silahkan cari kode berikut:
.sidebar .widget {      ATAU     #sidebar .widget {

Misalnya kita menemukan kode seperti di bawah ini, ganti tulisan merah dengan kode warna (untuk kode warna, lihat di sini) atau kode gambar.

.sidebar .widget {
    background: #333333 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdn8ChrA3Otz4begiesX8UeJzlLFtIBpNPGfAZX2t02ek57jsZRs3YZYhuwVy1P-B6XzpQ28SaqP04KI9pvsidAa5_h0a8HagxOleLn0pbdDGlHBjz-S2ACoz5RiTdc2JKNt-ezTYLtPw/);
    float:$startSide;
    width: 305px;
    margin: 0 0 10px 0;
    padding: 10px;
    border: 1px solid $bordercolor;
}

Dari contoh di atas, yang dimaksud dengan kode warna adalah "#333333" sementara kode gambarnya adalah "url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdn8ChrA3Otz4begiesX8UeJzlLFtIBpNPGfAZX2t02ek57jsZRs3YZYhuwVy1P-B6XzpQ28SaqP04KI9pvsidAa5_h0a8HagxOleLn0pbdDGlHBjz-S2ACoz5RiTdc2JKNt-ezTYLtPw/)".

Boleh hanya menggunakan kode warna, atau hanya menggunakan kode gambar atau boleh kedua-duanya. Silahkan sobat memilih...

Jika sudah mengerti dan sudah merubah backgroundnya, jangan lupa di simpan hasil kerja kerasnya, hihihi