Sebelumnya
Saat mulai ngeblog dan menambahkan widget-widget pada Blog merupakan bagian yang cukup menyenangkan salah satunya Widget Popular Post. Tentunya Anda sudah mulai menulis banyak dan mau menampilkan seberapa popular atau sering artikel tersbut dikunjungi oleh pengunjung Blog Anda. Artikel yang berada pada puncak atas dikunjungi paling banyak dan sering. Tetapi ada yang sepertinya kurang Saat Anda menambahkan Widget Popular Post ini kelihatannya isi kanan teks di bawahnya tidak sejajar dengan judul Widget, kemudian ada jarak yang cukup besar antara teks satu dan yang lainnya. Terus bagaimana solusinya?

Setelahnya
Sayangnya Blogger tidak ada versi default untuk widget popular postnya. Sehingga Anda sedikit bongkar kepala dan mencari-cari bagaimana solusinya! Setidaknya dapat dilakukan beberapa cara untuk merapikan widget popular post ini. 
 
Pengaturan Margin Widget.

1. Cara pertama
search kode: 
.sidebar .widget, .main .widget { border-bottom:1.5px dotted $bordercolor; margin:0 0 3.5em; padding:0 0 2.0em; }  

ganti menjadi:
ubah  margin:0 0 3.5em menjadi  margin:0 0 1.0em  lihat perubahan seperti di bawah ini:

.sidebar .widget, .main .widget { border-bottom:1.5px dotted $bordercolor; margin:0 0 1.0em; padding:0 0 2.0em; } 


bila cara pertama ini tidak membuahkan hasil, lakukan lagi cara keduanya.

2. Cara kedua:

Edit HTML pada pengaturan template Blogger Anda, cari kode CSS:
.widget .popular-posts ul { list-style: none; } kemudian tambahkan kode:  
border-bottom: 1.5px; margin:0 0 1.0em; padding:0 0 2.0em

sehingga perubahannya seperti di bawah ini:
.widget .popular-posts ul { list-style: none; border-bottom: 1.5px; margin:0 0 1.0em; padding:0 0 2.0em }

Kemudian SAVE.

2. Pengaturan Padding Widget
langsung saja tambah kode CSS di bawah ini untuk mengurangi jarak (row) antar teks agar terlihat rapi.

  
.widget .popular-posts ul {
  list-style: none; line-height:0em;
}

 
Anda dapat juga menambahkan properti dan nilai di dalam CSS di atas untuk pengaturan margin dan padding widget popular post seperti:

font-size:12px; margin:-0.1em  0px;
margin-bottom:-35px;


sehingga kodenya menjadi:
widget .popular-posts ul {
  list-style: none; line-height:1em; font-size:12px; margin:-0.1em  0px;
margin-bottom:-35px;
}


Anda dapat mengubah nilai yang ada pada widget di atas sesuai dengan keinginan dan kondisi widget blog sendiri.

Jangan lupa SAVE kembali.

Sekian dulu semoga membantu dan Kini Widget Popular Post Anda sudah rapi, hati pun senang :)

Selamat mencoba, semoga sukses. Be Creatif!

Post a Comment:

Teman-teman Google+ Terkren!