Cara mengganti warna Background judul sidebar blog, pernahkah anda melihat blog yang mempunyai sidebar berwarna warni,seperti di blog saya ini, ya itu dia yang saya maksud di samping untuk mempercantik tampilan blog ada manfaat lainya yang tentu saja bisa membuat nyaman pengunjung.yang saya maksud disini adalah widget yang ada di kanan kiri blog atau di bagaian fotter atau widget bawah, contoh kecilnya adalah anda menaruh popular post,artikel terkini,join site,profil google plus anda dan masih banyak yang lainya,tentu kalau menggunakan sidebar bawaan blogger atu downloadan dari template gratis warnanya kadang gak cocok dengan selera kita,tentu saja anda ingin mengganti sidebar tersebut.
untuk cara mengganti warna backgraound judul sidebar blog, anda perlu mengikuti langkah demi langkah di bawah ini:
pertama : Login ke dasbor Blogger.
kedua: Pilih pengaturan template dan klik edit html.
ketiga: Klik cadangkan/pulihkan dan unduh template blog, untuk jaga-jaga. klo terjadi eror kamu bisa mengembalikannya lagi kesemula.
keempat: Selanjutnya Klik Edit Html dan Cari kode h2 { . Lengkapnya seperti dibawah ini.
/* Headings
----------------------------------------------- */h2 {
font: $(widget.title.font);
color: $(widget.title.text.color);
}
----------------------------------------------- */h2 {
font: $(widget.title.font);
color: $(widget.title.text.color);
}
kelima: Tambahkan kode background:#2288BB; padding:4px 15px 3px;text-transform:none;
keenam: Jadi kode lengkapnya seperti ini.
/* Headings
----------------------------------------------- */
h2 {
font: $(widget.title.font);
color: $(widget.title.text.color);background:#2288BB;
padding:4px 15px 3px;text-transform:none;
}
----------------------------------------------- */
h2 {
font: $(widget.title.font);
color: $(widget.title.text.color);background:#2288BB;
padding:4px 15px 3px;text-transform:none;
}
ketujuh: Ganti kode #2288BB; dengan kode warna yang kamu inginkan.
kedelapan: Setelah itu coba di Preview / pratinjau template kamu. Jika sudah berubah warna background judul sidebar kamu. Baru di Save.
kesembilan: Jika Belum, Coba dilihat lagi kode warnanya, background:#2288BB; Pastikan Kode ini " ; " ada dibelakang kode warna(tanpa tanda ""), jika kode itu hilang maka warna tidak akan berubah. Selesai.
Jika sidebar kamu ingin diberi lengkungan di setiap sudutnya. Kalian bisa tambahkan kode border-radius: 11px 0px 11px 0px; keterangan kode: border-radius: atas kiri-atas kanan-bawah kiri-bawah kanan. Untuk lebih jelasnya kalian bisa edit di sinihttp://www.cssportal.com/css3-rounded-corner/.
Cara diatas akan merubah warna judul sidebar widget di bagian kiri-kanan blog, dan juga footer widget dibagian bawah. Jika ingin membuat warna background judul yang berbeda antara sidebar dan footer. Gunakan cara dibawah ini.
Cara diatas akan merubah warna judul sidebar widget di bagian kiri-kanan blog, dan juga footer widget dibagian bawah. Jika ingin membuat warna background judul yang berbeda antara sidebar dan footer. Gunakan cara dibawah ini.
Hanya sidebar widget bagian kiri-kanan blog
1. Cari kode .sidebar .widget h2 { dan tambahkan kode background:#2288BB; padding:4px 2px 2px; dibawahnya. Save Template selesai.
2. Atau gunakan cara dibawah ini. Cari kode ]]></b:skin> dan tambahkan kode berikut di atas kode ]]></b:skin>
.sidebar .widget h2 {
background:#2288BB; padding:4px 2px 2px;
}
background:#2288BB; padding:4px 2px 2px;
}
Hanya Footer widget bagian bawah blog.
1. Cari kode .footer-inner .widget h2 { dan tambahkan kode background:#2288BB; padding:4px 2px 2px; dibawahnya. Save Template selesai.
2. Atau gunakan cara dibawah ini. Cari kode ]]></b:skin> dan tambahkan kode berikut di atas kode ]]></b:skin>
.footer-inner .widget h2 {
background:#2288BB; padding:4px 2px 2px;
}
Setiap template mempunyai perbedaan. Jika tidak menemukan kode-kode diatas. Cobalah untuk mencari kode yang semirip mungkin dengan kode HTML diatas.atau anda bisa meninggalkan komentar di bawah ini. Semoga Bermanfaatbackground:#2288BB; padding:4px 2px 2px;
}
0 komentar:
Posting Komentar