Halo para pengunjung......
Kali ini admin akan SHARE "Cara memodifikasi tampilan entri populer di
blog", sebelumnya apa itu entri populer? itu adalah pilihan entri atau
pos yang paling banyak dilihat atau dikunjungi oleh orang-orang.
Biasanya tampilan entri populer default agak jelek, jadi saya akan SHARE
cara memodifikasinya. Bagaimana wujudnya? berikut demonya
CARA MEMODIFIKASINYA
Berikut tutorialnya.
- Log in ke akun blogger kalian
- Pilih menu Template
- Pilih Edit HTML
- Cari kode ]]></b:skin>
- Masukan kode berikut tepat diatas kode ]]></b:skin>
/* Custom CSS for Blogger Popular Post Widget */
.PopularPosts ul,
.PopularPosts li, .PopularPosts li img, .PopularPosts li a, .PopularPosts li a img { margin:0 0; padding:0 0; list-style:none; border:none; background:none; outline:none; } margin:0 0; padding:0 0; list-style:none; border:none; background:none; outline:none;} margin:0 0; padding:0 0; list-style:none; border:none; background:none; outline:none;} margin:0 0; padding:0 0; list-style:none; border:none; background:none; outline:none;}.PopularPosts ul { margin:.5em 0; list-style:none; font:normal normal 13px/1.4 "Arial Narrow",Arial,Sans-Serif; color:black; counter-reset:num; } margin:.5em 0; list-style:none; font:normal normal 13px/1.4 "Arial Narrow",Arial,Sans-Serif; color:black; counter-reset:num;} margin:.5em 0; list-style:none; font:normal normal 13px/1.4 "Arial Narrow",Arial,Sans-Serif; color:black; counter-reset:num;} margin:.5em 0; list-style:none; font:normal normal 13px/1.4 "Arial Narrow",Arial,Sans-Serif; color:black; counter-reset:num;}.PopularPosts ul li img { display:block; margin:0 .5em 0 0; width:50px; height:50px; float:left; } display:block; margin:0 .5em 0 0; width:50px; height:50px; float:left;} display:block; margin:0 .5em 0 0; width:50px; height:50px; float:left;} display:block; margin:0 .5em 0 0; width:50px; height:50px; float:left;}.PopularPosts ul li { background-color:#eee; margin:0 10% .4em 0; padding:.5em 1.5em .5em .5em; counter-increment:num; position:relative; } background-color:#eee; margin:0 10% .4em 0; padding:.5em 1.5em .5em .5em; counter-increment:num; position:relative;} background-color:#eee; margin:0 10% .4em 0; padding:.5em 1.5em .5em .5em; counter-increment:num; position:relative;} background-color:#eee; margin:0 10% .4em 0; padding:.5em 1.5em .5em .5em; counter-increment:num; position:relative;}.PopularPosts ul li:before, .PopularPosts ul li .item-title a { font-weight:bold; font-size:120%; color:inherit; text-decoration:none; } font-weight:bold; font-size:120%; color:inherit; text-decoration:none;} font-weight:bold; font-size:120%; color:inherit; text-decoration:none;} font-weight:bold; font-size:120%; color:inherit; text-decoration:none;}.PopularPosts ul li:before { content:counter(num); display:block; position:absolute; background-color:black; color:white; width:30px; height:30px; line-height:30px; text-align:center; top:50%; right:-10px; margin-top:-15px; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px; } content:counter(num); display:block; position:absolute; background-color:black; color:white; width:30px; height:30px; line-height:30px; text-align:center; top:50%; right:-10px; margin-top:-15px; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px;} content:counter(num); display:block; position:absolute; background-color:black; color:white; width:30px; height:30px; line-height:30px; text-align:center; top:50%; right:-10px; margin-top:-15px; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px;} content:counter(num); display:block; position:absolute; background-color:black; color:white; width:30px; height:30px; line-height:30px; text-align:center; top:50%; right:-10px; margin-top:-15px; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px;}/* Set color & level */.PopularPosts ul li:nth-child(1) {background-color:#E11E28;margin-right:1%}.PopularPosts ul li:nth-child(2) {background-color:#FD3C03;margin-right:2%}.PopularPosts ul li:nth-child(3) {background-color:#FECB09;margin-right:3%}.PopularPosts ul li:nth-child(4) {background-color:#6EBE27;margin-right:4%}.PopularPosts ul li:nth-child(5) {background-color:#149A48;margin-right:5%}.PopularPosts ul li:nth-child(6) {background-color:#5BBFF1;margin-right:6%}.PopularPosts ul li:nth-child(7) {background-color:#61469C;margin-right:7%}.PopularPosts ul li:nth-child(8) {background-color:#863E86;margin-right:8%}.PopularPosts ul li:nth-child(9) {background-color:#863E62;margin-right:9%}.PopularPosts ul li:nth-child(10) {background-color:#815540;margin-right:10%}
- Klik Simpan
Berikut Tutorialnya
- Log in ke akun blogger kalian
- Pilih menu Tata Letak
- Klik Tambah Gadget
- Cari Entri Populer
- Klik Simpan
Jika ada yang ingin ditanyakan komen juga!
Sumber : http://creative-blog10.blogspot.com/2014/01/cara-memodifikasi-tampilan-entri.html
Thank's Bro masih menghormai susah payah ketikanku! Dengan sumber yang ada aku seneng karena ada yang mau mengakui bahwa artikel yg mereka gunakan itu COPAS....
BalasHapusDan bru lo yg gwe liat lakuin hal itu
Salam Rafi Blog
sama²
BalasHapusAs a farmer managing livestock, I rely on tractors for tasks like feeding and manure transport. The john deere 4440 is quite appealing, yet I'm also looking into the john deere 5020 for more demanding field jobs. The john deere 4640 appears to be ideal for tillage work, while the kubota b7100 seems suitable for everyday tasks. Finally, I’m contemplating whether the john deere 1010 would provide the best return on investment for overall farming flexibility. Which one would you recommend?
BalasHapus