Kebanyakan snippet atau deskripsi populer default blogger terlalu panjang, sehingga membuat widget di sidebar tampak tidak rapi untuk tampilan dan memakan ruang yang begitu lebih. trik ini juga bisa digunakan untuk mempercantik widget populer post hasil dari kreasi sobat sendiri sebagai tambahan css agar widget populer post sobat tambah keren dan beda dari pada yang lain. langsung saja simak trik dan caranya.
1. Menggunaan Java Script
Sobat bisa menggunakan javascript berikut untuk trik ini
<script type='text/javascript'>
//<![CDATA[
$('.popular-posts ul li .item-snippet').each(function(){
var txt=$(this).text().substr(0,50);
var j=txt.lastIndexOf(' ');
if(j>42)
$(this).text(txt.substr(0,j).replace(/[?,!\.-:;]*$/,'...'));
});
//]]>
</script>
Letakkan kode Java Script tersebut diatas kode
</body>2. Menggunaan CSS
CSS untuk memotong kalimat ini ada dua model satu tanpa titik dan dengan titik, yaitu
Clip dan
ellipsis.
A. menggunakan css yang berakhir titik seperti cara menggunakan javascript.
kopi kede berikut:
.PopularPosts .item-snippet {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
-moz-binding: url('assets/xml/ellipsis.xml#ellipsis');
}
Kode CSS diatas letakkan saja diatas kode
]]></b:skin>B. menggunakan css tanpa titik
.PopularPosts .item-snippet {
white-space: nowrap;
overflow: hidden;
text-overflow: clip;
}Sama seperti kode di atas, Kode CSS diatas letakkan saja diatas kode
]]></b:skin>mudahkan, selamat mencoba dan semoga manfaat...
Belum ada tanggapan untuk "Trik untuk memotong Snippet Popular Post"
Post a Comment