Posted by : Unknown Thursday, November 28, 2013

Cara Merubah Tampilan Popular Post Dengan CSS3,itulah yang akan saya bahas sekarang, Popular post memang sangat penting untuk di tampilkan dalam blog guna memberikan informasi seputar artikel yang baru kita posting,namun terkadang kita merasa jenuh dengan tampilan popular yang monoton,oleh karena itu sekarang saya akan beri sedikit tips supaya tampilan popular post sobat tidak bikin bosan.tampilan popular postnya bisa sobat lihat dalam gambar di samping.apalagi dengan tampilan popular post yang sudah di modif di tambahefek berjalan pada populra post wah bikin mantap tuh sob.

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.

Leave a Reply

Terima Kasih Telah Berkunjung... :)
Semoga Apa Yang Saya Share Dapat Bermanfaat Bagi Teman-Teman Semua.
Mohon Tinggalkan Like & Comment.
share Juga Ya Ke Teman-Teman Kalian !!
Jika Ingin Copas, Mohon Sertakan Narasumber nya !!
http://berbagiketerampilan.blogspot.com/

Subscribe to Posts | Subscribe to Comments

Welcome to My Blog

Apakah Blog Ini Dapat Membantu Anda ?

Follow My Facebook

~KpM~MaSTeR~STARS~. Powered by Blogger.

- Copyright © Berbagi Ilmu {-KpM-} -Robotic Notes- Powered by Blogger - Designed by zevry mario -