Cara Terbaru Membuat Popular Post Warna-warni

Cara Terbaru Membuat Popular Post Warna-warni Cara Terbaru Membuat Popular Post di blog Warna-warni, Cara Mudah Membuat Widget Popular Post Warna-Warni di Blogger, Cara Membuat Widget Popular Post Menjadi Warna-Warni.
http://www.caraterbaru.web.id/2015/01/cara-terbaru-membuat-popular-post-warna.html
Cara Membuat Widget Popular Post Menjadi Warna-Warni - Widget popular post menggambarkan  beberapa artikel yang paling populer atau dapat dikatakan sering dikunjungi. Selai itu widget popular post juga berfungsi untuk memikat mata pengunjung agar mereka membaca artikel yang sedang populer tersebut. Agar menarik minat pengunjung atau visitor maka widget popular post sebaiknya dibuat warna-warni. Berikut tutorialnya: Baca juga >> Cara terbaru custom domain di Godaddy

  • Langkah Pertama, pasang widget popular post silahakan menuju dashboard blogger lalu >> (Tata Letak => Tambahkan Gadget=> Entri Populer => Simpan) silahakan pilih mau pakai thumbnail, kutipan atau tidak. (perhatikan gambar dibawah): Jangan lewatkan artikel Populer kami >> Cara terbaru daftar google adsense agar cepat diterima

http://www.caraterbaru.web.id/2015/01/cara-terbaru-membuat-popular-post-warna.html
  • Kemudian menuju menu Template => Edit HTML 
  • Masukkan kode dibawah tepat diatas kode ]]></b:skin> atau </style>
 ... /* Modifikasi Widget Popular Post Warna Warni */
.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 &quot;Arial Narrow&quot;,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 and level */
.PopularPosts ul li:nth-child(1) {background-color:#E11E28;margin-right:2%}
.PopularPosts ul li:nth-child(2) {background-color:#FD3C03;margin-right:2%}
.PopularPosts ul li:nth-child(3) {background-color:#FECB09;margin-right:2%}
.PopularPosts ul li:nth-child(4) {background-color:#6EBE27;margin-right:2%}
.PopularPosts ul li:nth-child(5) {background-color:#149A48;margin-right:2%}
.PopularPosts ul li:nth-child(6) {background-color:#5BBFF1;margin-right:2%}
.PopularPosts ul li:nth-child(7) {background-color:#61469C;margin-right:2%}
.PopularPosts ul li:nth-child(8) {background-color:#863E86;margin-right:2%}
.PopularPosts ul li:nth-child(9) {background-color:#863E62;margin-right:2%}
.PopularPosts ul li:nth-child(10) {background-color:#815540;margin-right:2%}


    ...

  • Lalu Simpan Template, lihat hasilnya... Jangan lewatkan Hot artikel kami >> Auto submit URL ke situs GOV/EDU
  • Tags: Cara Terbaru Membuat Popular Post Warna-warni Cara Terbaru Membuat Popular Post di blog Warna-warni, Cara Mudah Membuat Widget Popular Post Warna-Warni di Blogger, Cara Membuat Widget Popular Post Menjadi Warna-Warni.
    Disqus
    Blogger
    Pilih Sistem Komentar

    8 comments

    makasih artikelnya,
    sya juga mau popular post d bol saya warna warni,suka liatnya,,
    meluncur praktekk

    Balas

    wah keren dan lucu nih kalau popular postnya warna warni hehehe

    Balas

    langsung coba deh gan,,,makasih ya :-bd

    Balas

    sipp mas, makasih kunjungannya

    Balas

    wah, kayaknya menarik ni. makasih gan ilmunya, nanti saya coba

    Balas

    Wuih muantap popular postnya, mau coba praktekkan dulu ah

    Balas

    Terimakasih ya gan atas informasinya...langsung di sedot neh....

    Balas

    - Berkomentarlah yang sopan
    - Komentar tidak OOT ( Out Of Topic )
    - Jangan Menaruh Livelink atau sejenisnya

    Advertiser

    Live Chat Cara Terbaru
    ×
    _

    Hai! Kamu bisa kirim pesan ke Admin di sini, jangan lupa LIKE Cara Terbaru ya... Terima kasih.