Sebelum kepada penjelasan, standarnya kode untuk menampilkan Label adalah seperti ini :
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url + "?max-results=8"' expr:title='data:label.name' rel='tag nofollow'>
<data:label.name/>
</a>
<b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
Maka berapapun sobat menulis label, label akan muncul seluruhnya pada postingan. Ini artinya, ketika 7 Label ditulis, maka semuanya akan tampil.
Untuk memahami penjelasan selanjutnya, harap diperhatikan kode yang saya tandai
<b:if cond='data:label.isLast != "true"'>,</b:if>
, ini artinya "Selain label terakhir maka tampilkan koma".Menentukan Jumlah Label yang Tampil
Study Kasus
Misalkan sobat mebuat sebuah postingan dengan judul 5 Kesamaan Gatot Barajamusti Dan Kangjeng Taat Pribadi, kemudian membuat 7 label. Misal: Artis, Berita, Gossip, Info, Penangkapan, Penggandaan Uang, Penipuan, Taat Pribadi. Maka akan tampil seperti di bawah ini:Semua label akan tampil seperti gambar di atas, dengan berbagai alasan, misalkan mengganggu tampilan atau estetika, maka sobat hanya ingi menampilkan 3 Label saja. Maka kode untuk Menampilkan Label (paling atas) ganti dengan kode ini:
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label' index='x'>
<b:if cond='data:x==0'><data:label.name/>, </b:if>
<b:if cond='data:x==1'><data:label.name/>, </b:if>
<b:if cond='data:x==2'><data:label.name/></b:if>
</b:loop>
</b:if>
Kita menambahkan
index=x
untuk memanggil label yang di tampilkan. Tetapi kode di atas belum ditambahkan link, sehingga tidak clickable (tidak bisa diklik menuju search label). Hasilnya seperti ini :Pembacaan Label ke-1 dimulai dari angka 0, bukan 1. Sehingga menampilkan label ke-1 dengan kode
<b:if cond='data:x==0'>
Penulisan
<b:if cond='data:label.isLast != "true"'>,</b:if>
, tidak diperluka karena tidak akan berpengaruh. Label terakhir yang tampil bukan label sesunggunya. Perhatikan lagi penjelasan sebelumnya!Alternatif ke-2
Lebih simple lagi dengan kode di bawah ini :<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label' index='x'>
<b:if cond='data:x<=2'><data:label.name/>, </b:if>
</b:loop>
</b:if>
Tapi kekurangannya masih menampilkan
,
(koma) pada label Terakhir. Penampakan :Alternatif ke-3
Saya lebih merekomendasikan kode ini daripada sebelumnya, karena sudah menggunakan Link ke search Label.<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label' index='x'>
<b:if cond='data:x <=2'>
<a expr:href='data:label.url + "?max-results=8"' expr:title='data:label.name' rel='tag nofollow'>
<data:label.name/>
</a>
<b:if cond='data:x <=1'>,</b:if>
</b:if>
</b:loop>
</b:if>
Perhatikan yang ditandai
<b:if cond='data:x <=1'>,</b:if>
artinya, sampai label ke 2 tambahkan koma.Memilih Label
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label' index='x'>
<b:if cond='data:x<6 and data:x>2'>
<a expr:href='data:label.url + "?max-results=8"' expr:title='data:label.name' rel='tag nofollow'>
<data:label.name/>
</a>
</b:if>
<b:if cond='data:x<5 and data:x>2'>, </b:if>
</b:loop>
</b:if>
Kode di atas adalah untuk menampilkan kode ke-3 sampai ke -5. Penampakannya seperti ini :
Untuk selanjutnya silahkan di explore dan dikreasikan sendiri, sesuai ide masing-masing.
Contoh Kreasi Kode
Sobat bisa berkreasi dengan penambahan class, tentunya sedikit sentuhan pada HTML. Contoh yang saya buat, membuat label-label tersebut berbeda warna. Hasilnya seperti ini:Kodenya gimana? ya sobat fahami, kreasi.. Kalo disuapin terus ga pinter-pinter nantinya.. 😃