Cara Membuat Popular Post Keren Warna Warni Di Widget Blog

adscblog

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

adscblog

Recommendation Apps

ads1

Previous

Posting Lebih Baru

Next

Posting Lama

Posted by Dede Ubed, Published at 04 Mei and have 0 komentar