Random Post

Seputar Windows

Home » » Cara Merubah Tampilan Popular Post Dengan CSS3

Cara Merubah Tampilan Popular Post Dengan CSS3

Cara Merubah Tampilan Popular Post Dengan CSS3,itulah yang akan saya bahas sekarang,pada pertemuan sebelumnya saya sedikit membahas tentang Cara Membuat Animasi Cover DVD.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/AVvXsEiFxftWpol97u_cOQ09PS98KtzoP3R1nYVPLoO_fhI3EvJnCscZcbR7ukP815tYkdhGnlH5sbrfAcyKCC7XCMke1ObrppnCE__gkVRCep0xOJgpVNUy3cveKRxAgId2GSFuAgS15Cm7J7g/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.

9 komentar:

  1. keren sob bisa di pasang di blog ane...thanks infonya.http://zaidinwelder.blogspot.com

    BalasHapus
    Balasan
    1. silahkan bost maksih banyak atas kunjungannya..

      Hapus
  2. Keren visit back : http://tati-adita.blogspot.com

    BalasHapus
  3. saya coba ah biar tampilan blog saya makin wokay.makasih boss

    BalasHapus
  4. mantap hasilnya gan...makasih ya dah mau berbagi ilmunya..

    BalasHapus
  5. saya edit lagi scriptnya tambah keren http://pengembarahitam.blogspot.com/

    BalasHapus
  6. Komentar ini telah dihapus oleh pengarang.

    BalasHapus

Saya sangat mengharapkan komentarnya yang bersipat membangun,dan gunakanlah bahasa yang sopan dan jelas.