Cara Membuat Popular Post Keren warna warni di blog

Cara Membuat WIdget Popular Post menjadi Warna Warni - Pada Tutorial kali ini saya akan berbagi tentang bagaimana cara membuat Popular Post menjadi Warna warni,Widget Popular Post Warna warni ini pernah menjadi Popular di kalangan Blogger

Sehingga tidak aneh jika di setiap Blog Widget Popular Post nya di rubah menjadi Warna warni,namun ada yang masih bingung apasih yang di maksud dengan Popular Post ? Popular Post yaitu widget atau sidebar yang berada di sebelah kanan blog atau Postingan yang selalu menampilkan Postingan postingan blog yang sering di baca oleh para pengujung

Setiap Postingan yang sering di baca oleh Para Pengujung tersebut maka akan tampil di widget Popular Post tersebut,Banyak Modifikasi Popular Post untuk mempercantik blog,agar para pengujun semakin betah berada di blog kita yang sedang membaca artikel yang mereka cari

Nah disini salah satu,saya akan berbagi trik cara membuat Popular Post menjadi Warna warni trik ini tidak memberatkan Loading blog sehingga apasalah nya jika sobat blogger yang akan mencoba untuk menggunakan Popular Post ini di blog nya

Untuk penggunaan Popular Post ini bisa anda ikuti langkah-langkah nya di bawah ini

• Masuk ke akun Blogger
• Lalu pilih Blog sobat > Tema > Edit Html
• Setelah berada di edit HTML silahkan masukan kode CSS berikut

.PopularPosts ul,.PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img{list-style:none;border:none;background:none;outline:none;margin:0;padding:0}.PopularPosts ul{list-style:none;font-size:15px;color:#fff;margin:0 !important;width:100% !important;font-weight:bold}.PopularPosts ul li img{display:block;transition:all 400ms ease-in-out;width:60px;height:60px;float:left;margin:0 15px 0 0;border:4px solid rgba(0,0,0,0.2)}.PopularPosts ul li img:hover{border:4px solid rgba(0,0,0,0.5);transition:all 400ms ease-in-out}.PopularPosts ul li{background-color:#eee;counter-increment:num;position:relative;margin:0 10% 0 0;padding:10px;height:70px;}.PopularPosts .item-title{text-overflow: ellipsis;overflow:hidden;height:64px}.PopularPosts ul li:before,.PopularPosts ul li .item-title a{font-size:15px !important;color:inherit;text-decoration:none}.PopularPosts ul li:before{content:counter(num);display:block;position:absolute;font-size:35px !important;font-weight:700;color:rgba(0,0,0,0.2);top:40%;left:9px;}
.PopularPosts ul li{margin:0 !important;padding:10px 5px 10px 40px}
.PopularPosts ul li:nth-child(1){background-color:#5d93b2}.PopularPosts ul li:nth-child(2){background-color:#67b8b3}.PopularPosts ul li:nth-child(3){background-color:#67c27a}.PopularPosts ul li:nth-child(4){background-color:#ee9f7e}.PopularPosts ul li:nth-child(5){background-color:#ea6868}.PopularPosts ul li:nth-child(6){background-color:#b65757}.PopularPosts ul li:nth-child(7){background-color:#e9c462}.PopularPosts ul li:nth-child(8){background-color:#84d558}.PopularPosts ul li:nth-child(9){background-color:#4dd38c}.PopularPosts ul li:nth-child(10){background-color:#b44d7a}

• Setelah itu silahkan Save Template dan Lihat hasil nya

 Nah itulah cara membuat atau memasang Widget Popular Post dengan Warna warni,semoga artikel ini bisa membantu sobat blogger dan blog nya semakin cantik,selamat mencoba

• SHARES
• Share
• Tweet
• Share
• Share

Previous

Posting Lebih Baru

Next

Posting Lama

Posted by D2Ubed, Published at Oktober 14, 2019 and have 0 komentar