Popular Post ini Tidak Mengunakan Gambar Menjadi lebih sederhana, kalau begitu, Langsung kita akan, Mencoba membuatnya dan Tutorialnya seperti ini
Cara Pertama : Membuat Widget Popular post
- Login Ke Blogger
- Pergi ke Menu ''Tata Letak''
- Klik ''Tambah Gadget''
- Cari gadget ''Entri Populer'', dan atur Settinganya Seperti ini : Jangan Ceklis thumbnail gambar dan cuplikan
Cara Ke dua : Memasang Kode CSS
- LOgin Ke Blogger
- Pergi Ke Menu ''Template''
- Klik ''Edit HTML''
- Cari kode ]]></b:skin setelah ketemu kodenya Masukan kode dibawah ini diatas kode tadi
/* Popular Post Customization */
.popular-posts ul li a {
background: none repeat scroll 0 0 #DDDDDD;
color: #444444;
display: block;
margin: 0 0 0.5em;
padding: 0.4em;
position: relative;
text-decoration: none;
transition: all 0.3s ease-out 0s;
}
.popular-posts ul li a:before {
background: none repeat scroll 0 0 #CCCCCC;
font-weight: 700;
height: 2em;
left: -2.5em;
line-height: 2em;
margin-top: -1em;
position: absolute;
text-align: center;
top: 50%;
width: 2em;
}
.popular-posts ul li a:after {
border: 0.5em solid transparent;
content: "";
left: -1em;
margin-top: -0.5em;
position: absolute;
top: 50%;
transition: all 0.3s ease-out 0s;
}
.popular-posts ul li a:hover {
background: none repeat scroll 0 0 #CCCCCC;
}
.popular-posts ul li a:hover:after {
border-left-color: #CCCCCC;
left: -0.5em;
}
.popular-posts ul li:first-child + li + li + li + li + li + li + li + li + li a:before{content:"10"}
.popular-posts ul li:first-child + li + li + li + li + li + li + li + li a:before{content:"9"}
.popular-posts ul li:first-child + li + li + li + li + li + li + li a:before{content:"8"}
.popular-posts ul li:first-child + li + li + li + li + li + li a:before{content:"7"}
.popular-posts ul li:first-child + li + li + li + li + li a:before{content:"6"}
.popular-posts ul li:first-child + li + li + li + li a:before{content:"5"}
.popular-posts ul li:first-child + li + li + li a:before{content:"4"}
.popular-posts ul li:first-child + li + li a:before{content:"3"}
.popular-posts ul li:first-child + li a:before{content:"2"}
.popular-posts ul li:first-child a:before{content:"1"}
/* Popular Post Customization */
- Setelah Selesai, Simpan Templatenya
Demikianlah artikel Ini Mudah Kan ? Semoga artikel ini Bermanfaat dan mudah untuk di Pratekkan dan Silakan Komentarin artikel Di kolom komentar dibawah ini..
