Saya pertama kali tau singkatan "K" ini sekitar 5 tahun lalu dan saya kira datang dari bahasa gaul dan ternyata ada sejarahnya yaitu berasal dari bahasa Yunani 'chilioi' yang berarti ribuan. 10K, 200K, 50K itu adalah angka-angka yang kerap kali ditemui ketika berbelanja. Tahukah Anda apa arti satuan 'K' di belakang angka tersebut? Huruf 'K' menjadi penting karena huruf itu merupakan pengganti ribu saat menyebutkan harga atau jumlah. Lalu, kenapa 'K' bisa mempunyai arti tersebut? Usut punya usut, Dikutip dari laman Merriam-Webster, satuan 'K' memiliki kepanjangan kilo. Kilo digunakan sebagai unit pengukuran dalam Sistem Satuan Internasional atau SI (Système international d'unités). Misalnya dalam mengukur jarak, 1 kilometer sama dengan 1.000 meter. Sedangkan untuk mengukur berat, 1 kilogram sama dengan 1.000 gram. Kata kilo berasal dari bahasa Yunani 'chilioi' yang berarti ribuan, digunakan untuk menyatakan banyak atau jamak.
Saya sempat kebingungan bagaimana cara menampilkan gambar Avatar atau Author image di Template Essential maupun Contempo karena kode bawaan dari kedua tema tersebut tampaknya tidak bekerja.
Setelah mencoba mengambil kode dari Template Notable dan memasangnya pada kedua template tersebut barulah gambar avatarnya mau muncul. Berikut ini kodenya:
<b:include data='{image: data:post.author.authorPhoto.image,imageRatio: "1:1",imageSizes: [50],sourceSizes: "50px",imageClass: "author-image"}' name='responsiveImage'/>
Hasilnya akan seperti gambar dibawah ini.
Cara pasang Author image di Template Essential / Contempo
Kode tersebut dapat dipasang dimana saja apakah diatas postingan disebelah nama dan tanggal ataupun diakhir postingan.
Namun lebih afdolnya pasang dalam area <b:includable id='postFooterAuthorProfile' var='post'> yang nantinya akan muncul diakhir postingan. Lihat gambar dibawah ini.
Pada aslinya susunannya memang begitu jadi saya yakin tidak sulit menemukan area itu dalam Template dan jika sudah ketemu kita hanya perlu menambahkan kode berikut saja disana.
<b:include data='{image: data:post.author.authorPhoto.image,imageRatio: "1:1",imageSizes: [50],sourceSizes: "50px",imageClass: "author-image"}' name='responsiveImage'/>
Setelah kode tersebut terpasang dalam Template dan seperti biasa kita bisa menampilkannya atau tidak melalui halaman Tata Letak > Gadget Blog > Edit (ikon pensil) > Conteng Tampilkan Profile Pengarang Dibawah Pos > Simpan > Selesai.
Jika belum mau muncul juga, kemungkinan karena <b:includable id='postFooterAuthorProfile' var='post'> belum di include.
Jika memang belum maka silakan di include dulu dengan kode berikut kedalam <b:includable id='postFooter' var='post'>.
<b:include cond='data:widget.type == "Blog"' data='post' name='postFooterAuthorProfile'/>
Seperti contoh gambar dibawah ini.
Jika belum mau muncul juga, sungguh terlalu, yang jelas di Template yang saya pakai mau kok muncul.
Sekalian saya sertakan contoh css dibawah ini, barangkali dibutuhkan, dengan catatan sesuaikan kode warnanya "posts.boxshadow.color" dengan Template Anda, kalau tidak maka akan error.
.author-profile{
-webkit-box-flex:0;
flex:0 0 auto;
-webkit-box-ordinal-group:5;
order:4;
border:1px solid $(posts.boxshadow.color);
border-radius:2px;
margin:0;
padding:7px 16px
}
.author-profile .author-about{
text-align:left
}
.author-profile .author-image{
float:left;
margin-right:10px
}
.author-profile .author-image img{
height:50x;
width:50px;
border-radius:50%;
border:1px solid $(posts.boxshadow.color)
}
.author-profile .author-name{
padding:7px;
border:1px solid $(posts.boxshadow.color);
border-radius:2px
}
.author-profile .author-desc{
line-height:1.6em
}
Komentar
Posting Komentar