Blog akan semakin menarik apabila diisi dengan widget-widget yang akan membantu pengunjung dalam menemukan konten-konten yang ada pada blog kita. Contohnya adalah widget label yang akan menampilkan semua label dari posting yang telah kita buat. Selain itu ada juga widget untuk menampilkan posting berdasarkan label tertentu atau biasa disebut widget recent post by label.
Kembali ke topik, mengganti tampilan judul widget blog. Adakalanya mungkin saat sobat menambahkan widget tertentu, sobat juga ingin merubah tampilan judul widget tersebut. Kalau sobat ingin mengetahui cara mengganti tampilan judul widget di blog sobat, maka sobat berada pada artikel yang tepat. Tetap baca artikel ini sampai selesai, dan sobat akan mendapatkan ilmu yang sangat berharga.
Untuk mengganti tampilan judul sidebar pada blog, pertama sobat harus mengetahui nama selektor css dari sidebar sobat. Pada umumnya memang bernama sidebar. Untuk mengetahuinya, sobat dapat melakukan inspeksi elemen dengan cara klik kanan pada judul widget pada sidebar sobat, lalu pilih inspeksi elemen. Saat sobat mengarahkan mouse ke arah widget tersebut, akan tampak nama selektor, diawali dengan tanda # dan itu disebut selektor css.
Kemudian scroll ke atas lagi, sampai sobat menemukan kode yang bila disorot, maka semua widget sidebar sobat akan ikut diblok. Salin kode # dan nama yang mengikutinya. Kalau pada template yang saya gunakan ini, namanya adalah #sidebar-content.
Agar mudah, saya misalkan nama selektor widgetnya adalah #sidebar-content. Lalu yang perlu sobat lakukan adalah dengan menambahkan kode css berikut
#sidebar-content h2{font-size:100%; font-weight:bold; text-transform:uppercase; text-align:left; background-color:#2288cc; padding:5px; color:white;}
Salin kode css tersebut di atas kode ]]></b:skin> atau apabila sobat telah mengubah kode b:skin sobat, salin kode tersebut di atas kode </style>
Dan mungkin sobat ingin mengganti tampilan judul widget untuk widget tertentu, maka sobat dapat melakukannya dengan cara yang hampir sama, hanya saja ganti selektor css nya sesuai nama widgetnya. Misalnya untuk widget popular posts, nama selektornya adalah #PopularPosts.
Related Posts