Posted by : Unknown
Thursday, November 28, 2013
Buat sobat yang ingin mencoba untuk merubah tampilan popular post nya bisa lihat tutorialnya di bawah ini.
1. Seperti biasa sobat login dulu yah,awas jangan login pakai punya tetangga nich bisa bikin ribet nih.
2. Masuk ke bagian Template > 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/AVvXsEjxt0_sPuMdg76_2TaQ5s4crjQkBGZGrOPRl_DAv82zkN79_DX6CrWJJWpMaSdt2foHwqyUvQmZ0gIird2owR9qhFdCOT77FNtwitQSQllZgwT4g9ELtEXIXC1_9mq735tbY8sdo3hL_Wg/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.
Itulah sedikit uraian tentang Cara Merubah tampilan Popular Post Dengan CSS3,semoga dapat sedikit membantu sobat yang merasa bosan dengan tampilan popular post sebelum di modifikasi.terima kasih atas partisipasinya.