Berikut Tutorial Membuat Tampilan Posting Berbeda-Beda Berdasarkan Label :
Langkah Pertama adalah sobat harus temukan terlebih dahulu elemen yang biasanya digunakan untuk membungkus daftar label . cara mengetahuinya dengan cara inspect elemen
Langkah yang kedua Lihat semua posting yang ada kemudian cek masing-masing tautan di dalam span.post-labels Cek apakah di dalamnya terdapat kata tertentu atau tidak (misalnya: Android)
Jika ada, tambahkan satu kelas spesifik baru pada posting tersebut
Setelah itu Pasang kode Java Script di bawah ini tepat diatas kode </body>
<script type='text/javascript'>
$('.post').each(function() {
if ($(this).find('.post-labels a:contains(Android)').length) {
$(this).addClass('red');
} else if ($(this).find('.post-labels a:contains(Jelek)').length) {
$(this).addClass('green');
} else if ($(this).find('.post-labels a:contains(Bosan)').length) {
$(this).addClass('blue');
} else if ($(this).find('.post-labels a:contains(Mamamia)').length) {
$(this).addClass('yellow');
}
});
</script>
Nah langkah yang terkahir sobat pasang CSS ini di atas ]]></b:skin> atau </style>
.post.red {background-color:red; }
.post.green {background-color:green; }
.post.blue {background-color:blue; }
.post.yellow {background-color:yellow;}
Kemudian Simpan Template . Untuk memudahkan cara ini , saya sarankan untuk menggunakan Tool ini
Jika sobat ingin Tampilan Posting Berbeda-Beda Berdasarkan Label seperti pada blog ini , maka sobat harus kembangkan sendiri ya css nya :)
source:http://www.dte.web.id/