Halo gaes ☺kali ini saya akan membagikan Popular Post yang saya gunakan pada blog ini,gaada salahnya kan berbagi ya meskipun popular post saya kalau dikatakan bagus juga tidak,
Mungkin di luar sana banyak yang sudah membagikan berbagai macam bentuk dan model Popular post,dari yang warna - warni hingga yang beraneka bentuk dan ragam
Settingan yang saya gunakan disini tidak menggunakan tampilan thumbnail gambar post.
Untuk pemasangannya ikuti langkah '' berikut
1. Login Blogger
2. Pasang Popular Post sobat, kemudian
2. Klik menu Template 
3. Pilih Sesuaikan
4. Tingkat lanjut
5. Tambahkan CSS dan tempelkan kode CSS berikut
#PopularPosts1 h2{
padding:8px 10px 3px 0;
width:87%;
margin:0px;
font-size:16px;
position:relative;
left:0px;
display:block;
border-bottom:0px solid #000;
}
#PopularPosts1 ul{ list-style:none; counter-reset:li; padding:10px; width:100%; }
#PopularPosts1 li{ /* Styles of each element */ width:100%; position:relative; left:0; margin:0 0 6px 10px; padding:4px 5px; }
#PopularPosts1 ul li:before{ /* Style of the numbers */ content:counter(li); counter-increment:li; position:absolute; top:3px; left:-40px; font:normal normal 18px Oswald; width:26px; height:26px; border-radius: 50%; color:#000; /* Text color */ border: 6px solid #49bbb8; /* Rounded border color */ padding:0; text-indent:9px; }
#PopularPosts1 ul li a{ display:block; position:relative; left:-45px; width:100%; margin:0; min-height:28px; padding: 0px 3px 3px 50px; color:#000; /* color of the links */ text-decoration:none; font:normal normal 23px Oswald; font-size:14px; /* Font size of the links */ font-style: normal; text-transform:uppercase; }
#PopularPosts1 ul li a:hover{ color:#49bbb8; margin-left:3px;
#PopularPosts1 ul{ list-style:none; counter-reset:li; padding:10px; width:100%; }
#PopularPosts1 li{ /* Styles of each element */ width:100%; position:relative; left:0; margin:0 0 6px 10px; padding:4px 5px; }
#PopularPosts1 ul li:before{ /* Style of the numbers */ content:counter(li); counter-increment:li; position:absolute; top:3px; left:-40px; font:normal normal 18px Oswald; width:26px; height:26px; border-radius: 50%; color:#000; /* Text color */ border: 6px solid #49bbb8; /* Rounded border color */ padding:0; text-indent:9px; }
#PopularPosts1 ul li a{ display:block; position:relative; left:-45px; width:100%; margin:0; min-height:28px; padding: 0px 3px 3px 50px; color:#000; /* color of the links */ text-decoration:none; font:normal normal 23px Oswald; font-size:14px; /* Font size of the links */ font-style: normal; text-transform:uppercase; }
#PopularPosts1 ul li a:hover{ color:#49bbb8; margin-left:3px;
Jika anda ingin mengubah sesuaikan silahkan kreasikan menurut keinginan agan. Lihat pertinjau pada Popular Post agan di bawah kolom penambahan CSS,
COMMENTS