Home » » Cara Modifikasi Popular Post #Keren

Cara Modifikasi Popular Post #Keren

Written By syofyan agung on Kamis, 24 Oktober 2013 | 04.41

Cara Modifikasi Popular Post #Keren
Sebelumnya saya juga pernah membahas tentang modifikasi popular post blog, yaitu pada artikel modifikasi popular post warna warni dan kali ini saya akan membagikan lagi cara untuk memodifikasi popular post versi berbeda dari sebelumnya.

Dengan memodifikasi tampilan popular post menjadi lebih keren maka akan lebih menarik pengunjung untuk meliat artikel terpopular di blog anda, dan hal ini bisa juga untuk meningkatkan pageview blog anda.

Bukan hanya bisa untuk menarik perhatian pengunjung, karena tampilan popular post yang #keren juga bisa untuk menambah blog anda semakin #keren dipandang mata, dan juga hal ini bisa agar pengunjung betah berlama-lama di blog anda.

Berikut ini hasil modifikasi popular post #keren ini :

hasil modifikasi

Anda berminat menjadi popular post di blog anda seperti tampilan gambar diatas ?? jika anda berminat anda biisa melakukan langkah-langkahnya dibawah ini.

Cara Modifikasi Popular Post #Keren

1. Login ke blogger anda.
2. Klik Template > Edit HTML.
3. Anda 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/AVvXsEglohUj077x-v2kqSlyG0vQEs-77ay1m3vISVzFLCcR7RtSQyWY7rJKZFHsbnhmmBb43dUHQXgSXY3sm30_Ombrou-4MV0wZF_uCbU1k_Mj7bty0GHwfRX_Vtx5VeTbJXpU3zrcdDtIdMQ/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. Simpan template blog anda.

Lalu lihat hasil modifikasi popular post #keren ini, semoga anda suka hasil modifikasi popular post ini ya :) hehehe. dan hanya itulah artikel  Cara Modifikasi Popular Post #Keren semoga bisa bermanfaat bagi anda.

0 komentar:

Posting Komentar

Iklan