Cara Modifikasi Tampilan Popular Post Bawaan Blogger ( Default ) Dengan CSS3

Salam Blogger, bloggingpasuruan mua berbagi tentang Cara Modifikasi Tampilan Popular Post Bawaan Blogger ( Default ) Dengan CSS3. Popular post memang sangat penting untuk di tampilkan dalam blog guna memberikan informasi seputar artikel terpopuler dari Blog kita, atau artikel yang paling sering dikunjungi.

Buat Sobat yang ingin mencoba untuk merubah tampilan popular post nya bisa lihat tutorialnya di bawah ini.

1. Login ke Akun Blogger Sobat.

2. Masuk ke bagian Template >> EDIT HTML

3. Cari kode ]]></b:skin> dan letakan kode di bawah tepat di atasnya.

.popular-posts ul{padding-left:0px;}

.popular-posts ul li {background: #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3-b0i2VFnMQSSUqwbrg0lkQcIcloGoyxgaSzxFYFkjltOcndifFcng_AOLwB9spQ2FvNM_5b9WqjPfMYcRXpn_p1LvEX4lQ4fiTqlZE8A9Xk4Z6_Pl2io0oI0EGHdFksnHPnyx7ix0Yg/s1600/1.gif)  no-repeat scroll 5px 10px;

  list-style-type: none;

  margin:0 0 5px 0px;

  padding:5px 5px 5px 20px !important;

  border: 1px solid #ddd;

  border-radius:10px;

  -moz-border-radius:10px;

  -webkit-border-radius:10px;

}

.popular-posts ul

  li:hover {

  border:2px solid #6BB5FF;

background:#000000;

}

.popular-posts ul

  li a:hover {

  text-decoration:none;

color:#FFF8DC;

}

.popular-posts .item-thumbnail img {

  webkit-border-radius: 100px;

  -moz-border-radius: 100px;

  border-radius: 100px;

  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);

  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);

  box-shadow: 0 1px 3px rgba(0, 0, 0, .4);

}

4. Kemudian save,dan silahkan sobat lihat hasilnya.

Saya akan sangat berterima kasih jika sobat Blogger berkenan meninggalkan komentar, saran atau tambahan informasi serta pertanyaan seputar artikel Cara Modifikasi Tampilan Popular Post Bawaan Blogger ( Default ) Dengan CSS3. Semoga bermanfaat dan terima kasih...

Facebook

Twitter

Pinterest

More

Less

Tumblr

Mix

E-Mail

GMail

LinkedIn

Reddit

XING

WhatsApp

Hacker News

VK

Telegram

OK

Messenger

Line

Copy Link