Ketemu lagi kita di kesempatan artikel ini..ehm ...sobat mungkin sudah mengerti maksud judul di atas yang seperti terlihat pada gambar yaitu sebuah icon berbentuk folder yang biasa kita bisa lihat pada windows xp ...jika sobat ingin icon seperti di atas tampil di samping judul label atau category sobat silahkan melihat artikel ini selanjut nya.
Sebelum saya membuat artikel ini saya mencoba terlebih dahulu mengobok-obok blog saya...setelah di kotak katik akhir ya icon yang saya sisipkan di kode html berhasil ...cara nya juga ga terlalu sulit sobat tinggal memasukan kode script nya di Edit template HTML pada posisi yang tepat..
Ok..langsung aja ya kita coba mendesain nya
Seperti biasa anda login terlebih dahulu..kalau sudah login silahkan langsung ke RANCANGAN
Anda klik Edit HTML
Sebelum saya membuat artikel ini saya mencoba terlebih dahulu mengobok-obok blog saya...setelah di kotak katik akhir ya icon yang saya sisipkan di kode html berhasil ...cara nya juga ga terlalu sulit sobat tinggal memasukan kode script nya di Edit template HTML pada posisi yang tepat..
Ok..langsung aja ya kita coba mendesain nya
Seperti biasa anda login terlebih dahulu..kalau sudah login silahkan langsung ke RANCANGAN
Anda klik Edit HTML
sebelum nya anda download dulu templete agar jika ada kesalahan templete anda bisa di kembalikan seperti semula.
Jangan lupa di centang Expand Template Widget
Kalau sudah kita mulai mengobok-ngobok kode html nya
CARI KODE DI BAWAH INI..!!! cara cepat nya tekan (Ctr + F pada keyboard)
Cari Kode di Bawah ini :
]]></b:skin>
Kalo dah ketemu sobat copy kode di bawah ini lalu pastekan tepat di atas kode ]]></b:skin>
/*ICON LABEL----------------------*/
#Label1 ul, #Label2 ul{
list-style:none;
margin:0 0 0;
padding:0 0 8px;
}
#Label1 li, #Label2 li{
background:url(http://i965.photobucket.com/albums/ae136/boujan/folder.png) no-repeat;
padding-top:0;
padding-right:0;
padding-bottom:3px;
padding-left:20px;
margin-bottom:3px;
border-bottom:1px dotted #063E3F;
line-height: 1.2em;
}
#Label1 ul, #Label2 ul{
list-style:none;
margin:0 0 0;
padding:0 0 8px;
}
#Label1 li, #Label2 li{
background:url(http://i965.photobucket.com/albums/ae136/boujan/folder.png) no-repeat;
padding-top:0;
padding-right:0;
padding-bottom:3px;
padding-left:20px;
margin-bottom:3px;
border-bottom:1px dotted #063E3F;
line-height: 1.2em;
}
Catatan :
Tulisan yang saya beri warna merah adalah link icon gambar yang akan di sisipkan pada judul isi kategory blog..nah link ini bisa sobat ganti dengan icon-icon yang sobat sukai
untuk memperjelas nya maksud di atas silahkan sobat lihat gambar di bawah ini:
Setelah selesai simpan templete dan lihat hasil nya...!!!!
Jika Trik ini berhasil maka label atau category pada blog kita bisa tampil icon kecil di samping judul pada label blog...semoga artikel sederhanan ini dapat berguna bagi sobat semua...makasih..!!!
Jika Trik ini berhasil maka label atau category pada blog kita bisa tampil icon kecil di samping judul pada label blog...semoga artikel sederhanan ini dapat berguna bagi sobat semua...makasih..!!!
