Blog Setup: Entri populer lebih indah

Cara Membuat Entri Populer Menjadi Lebih Menarik. dengan begitu widget entri populer akan sangat mencolok dan mudah untuk dikenali bagi para pengunjung blog kita. dan kemungkinan tidak terlihat bagi para pengunjungpun sangat kecil.
Berikut langkah-langkanya
Pasang widget Entri Populer:
dengan cara Tata Letak ==> Tambahkan Gadget ==> Entri Populer ==> lalu save dan untu Entri Populer bisa anda ganti dengan selera anda seperti terlihat pada gambar di bawah ini:
Selanjutnya Pilih Menu Template kemudian => Edit HTML
Lalu masukkan code di bawah ini di pada ]]></b:skin> Atau </style> Letakkan diatasnya:

/* Entri Populer Menjadi indah */
.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;
}
/* http://rendiblogpost.blogspot.co.id */
.PopularPosts ul {
margin:.5em 0;
list-style:none;
font:normal normal 13px/1.4 "Arial Narrow",Arial,Sans-Serif;
color:black;
counter-reset:num;
}
/* http://rendiblogpost.blogspot.co.id */
.PopularPosts ul li img {
display:block;
margin:0 .5em 0 0;
width:50px;
height:50px;
float:left;
}
/* http://rendiblogpost.blogspot.co.id */
.PopularPosts ul li {
background-color:#eee;
margin:0 10% .4em 0;
padding:.5em 1.5em .5em .5em;
counter-increment:num;
position:relative;
}
/* http://rendiblogpost.blogspot.co.id */
.PopularPosts ul li:before,
.PopularPosts ul li .item-title a {
font-weight:bold;
font-size:120%;
color:inherit;
text-decoration:none;
}
/* http://rendiblogpost.blogspot.co.id*/
.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;
}
/* http://rendiblogpost.blogspot.co.id */
.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%}

Selasa, 10 Mei 2016

Entri populer lebih indah

Tidak ada komentar:

Posting Komentar

Arsip Blog

Kategori