Membuat Popular Post Warna-Warni

Membuat Popular Post Warna-Warni - Salam Pecinta Music Indonesia MP3 BagiShared - Kumpulan Musik dan Lagu MP3 Terbaru, Dikesempatan postingan artikel yang akan Anda baca kali ini dengan judul postingan Membuat Popular Post Warna-Warni, mp3bagishared.blogspot.com telah menyajikan kumpulan musik mp3 terbaik kapada Anda, agar untuk Anda nikmati dan dengarkan music mp3 didalamnya. Kami berharap isi postingan Postingan mengenai Blogger Widget, Postingan mengenai widget, yang kami sajikan untuk Anda ini dapat Anda nikmati. baiklah, selamat menikmati.

Judul : Membuat Popular Post Warna-Warni
link : Membuat Popular Post Warna-Warni

Membuat Popular Post Warna-Warni

Popular Post Warna-Warni
Gambar 1. Popular Post Warna-warni

Cara membuat popular post warna warni seperti gambar diatas atau yang ada diblog ini caranya sangat gampang. Tapi sebelumnya pastikan widget popular post diblog kamu hanya menampilkan thumbnail dan judul saja. (lihat gambar 2)

Gambar 2. Penerapan widget popular post

Setelah itu masuk ke Editor HTML Template, lalu copas kode dibawah ini tepat diatas kode ]]></b:skin> atau </style> :

/* Custom CSS for Blogger Popular Post Widget */
.PopularPosts ul,
.PopularPosts li,
.PopularPosts li img,
.PopularPosts li a,
.PopularPosts li a img {
  margin:0 0;
  padding:0 0;
  list-style:none;
  border:none;
  background:none;
  outline:none;
}
.PopularPosts ul {
  margin:.5em 0;
  list-style:none;
  font:normal normal 13px/1.4 "Arial Narrow",Arial,Sans-Serif;
  color:black;
  counter-reset:num;
}
.PopularPosts ul li img {
  display:block;
  margin:0 .5em 0 0;
  width:50px;
  height:50px;
  float:left;
}
.PopularPosts ul li {
  background-color:#eee;
  margin:0 10% .4em 0;
  padding:.5em 1.5em .5em .5em;
  counter-increment:num;
  position:relative;
}
.PopularPosts ul li:before,
.PopularPosts ul li .item-title a {
  font-weight:bold;
  font-size:120%;
  color:inherit;
  text-decoration:none;
}
.PopularPosts ul li:before {
  content:counter(num);
  display:block;
  position:absolute;
  background-color:black;
  color:white;
  width:30px;
  height:30px;
  line-height:30px;
  text-align:center;
  top:50%;
  right:-10px;
  margin-top:-15px;
  -webkit-border-radius:30px;
  -moz-border-radius:30px;
  border-radius:30px;
}
/* Set color & level */
.PopularPosts ul li:nth-child(1) {background-color:#E11E28;margin-right:1%}
.PopularPosts ul li:nth-child(2) {background-color:#FD3C03;margin-right:2%}
.PopularPosts ul li:nth-child(3) {background-color:#FECB09;margin-right:3%}
.PopularPosts ul li:nth-child(4) {background-color:#6EBE27;margin-right:4%}
.PopularPosts ul li:nth-child(5) {background-color:#149A48;margin-right:5%}
.PopularPosts ul li:nth-child(6) {background-color:#5BBFF1;margin-right:6%}
.PopularPosts ul li:nth-child(7) {background-color:#61469C;margin-right:7%}
.PopularPosts ul li:nth-child(8) {background-color:#863E86;margin-right:8%}
.PopularPosts ul li:nth-child(9) {background-color:#863E62;margin-right:9%}
.PopularPosts ul li:nth-child(10) {background-color:#815540;margin-right:10%}
Terakhir Simpan Template dan selesai.
Lihat widget populer pos kamu kamu sudah berwarna-warni kan kayak pelagi :D.
Okey, sampai disini dulu cara membuat popular post warna warni ini. Mudah mudahan bermanfaat buat kamu. Horas...

Thanks to dte.web.id


Judul postingan mp3 Membuat Popular Post Warna-Warni

Mungkin artikel Membuat Popular Post Warna-Warni kali ini, banyak kurangnya, baik segi kata-kata yang kami sajikan. Oleh karena itu kami mohon maaf atas postingan mp3 yang kami sajikan, jika berkenan silahkan share artikel Membuat Popular Post Warna-Warni ini.

Jangan lupa bookmark dengan cara menekan Ctrl+D pada artikel Membuat Popular Post Warna-Warni dengan alamat link https://mp3bagishared.blogspot.com/2013/03/membuat-popular-post-warna-warni.html siapa tahu nanti Anda membutuhkan lagi, sehingga tidak lupa mengunjungi kembali.


Demikianlah Artikel Membuat Popular Post Warna-Warni

Sekianlah artikel Membuat Popular Post Warna-Warni kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya.

Anda sekarang membaca artikel Membuat Popular Post Warna-Warni dengan alamat link https://mp3bagishared.blogspot.com/2013/03/membuat-popular-post-warna-warni.html
Hak Cipta: Semua konten berhak cipta yang terdapat di dalam blog ini sepenuhnya milik individu atau perusahaan terkait, jika Anda merasa dirugikan silahkan hubungi kontak kami.

Related Posts

Membuat Popular Post Warna-Warni
4/ 5
Oleh