Tutorial simple edit popular post widget


Just nak kongsi tutorial yg baru jer belajar tadi dan dah di cuba pun. Tutorial berkaitan cara nak edit popular post widget. Tapi ni hanya untuk yang display tajuk post sahaja bukan yg dispaly tajuk post sekali dengan thumbnail dan ringkasan entry tu eik. Caranya memang simple je.

Popular post widget dari blogger ni dia dah set kan padding atas dan bawah untuk list tajuk2 post tu kepada 0.75em, jadi kalau tgk widget ni memang nampak jurang yg sedikit besar antara tajuk2 tu, jadi untuk dekat kan sedikit jurang tu, caranya ialah:
  • Pergi ke design / Edit HTML dan cari ]]></b:skin>
  •  Letak code dibawah ni sebelum ]]></b:skin> tadi
    .PopularPosts .widget-content ul li {
    padding:.5em 0;
    }
  • Save sahaja.

Note : Korang boleh ubah 0.5em tu kepada saiz padding yg bersesuaian, contoh tukar ke 0.25em atau 0.4em ke bergantung kepada berapa jurang yg korang nak.

Selain tu korang boleh jugak meletakkan image disebelah kiri setiap list link popular post tadi, caranya cuma tambah code berwarna merah kat bawah ni
.PopularPosts .widget-content ul li {
padding:.25em 0;
padding-left: 20px;
background:url(http://1.bp.blogspot.com/_rGfAms2eYNQ/TUpxMhUCoEI/AAAAAAAAENE/4otdEJYFMVg/s1600/kulat.png); background-position:left; background-repeat:no-repeat;
}
Jangan lupa tukar url image kepada url image korang tersendiri eik..

Tu sahaja, selamat bereksperimentasi!!!

2 comments: