Posted by : Stiker Jalingkut
ASSALAMU'ALAIKUM APA KABAR SOBAT |
pada kesempatan kali ini kami mau berbagi sedikit Tutorial Cara Merubah Populer Post Menjadi Nomer Urutan emangsi sudah banyak para Mater2 Css yang merubah Populer Post dengan bermacam aktribut dan bermacam model kata para selebritis hehehehhe. Nah tapi kali ini kami mau ikut2tan kaya para Master Css mencoba ingin merubah Populer Post tapi kali ini ingin kami rubah menjadi Nomer berurutan Silakan lihat Demonya mas |
ASSALAMU'ALAIKUM APA KABAR SOBAT |
<style type='text/css'>/*--- Orginal Popular Posts Editing www.bloggertutoria.com --- */
.popular-posts ul {background: rgb(30, 50, 230);
background: -moz-linear-gradient(30deg, rgb(30, 50, 230) 30%, rgb(90, 140, 250) 70%);
background: -webkit-linear-gradient(30deg, rgb(30, 50, 230) 30%, rgb(90, 140, 250) 70%);
background: -o-linear-gradient(30deg, rgb(30, 50, 230) 30%, rgb(90, 140, 250) 70%);
background: -ms-linear-gradient(30deg, rgb(30, 50, 230) 30%, rgb(90, 140, 250) 70%);
background: linear-gradient(30deg, rgb(30, 50, 230) 30%, rgb(90, 140, 250) 70%);
padding-left: 0px;
counter-reset: popcount;webkit-animation: pulsate 1.2s linear infinite;animation: pulsate 1.2s linear infinite;}@-webkit-keyframes pulsate{0%{color: #00ff00; text-shadow: 0 -1px 0 #000; }50% { color: #0000ff; text-shadow: 0 -1px 0 #444, 0 0 5px #ffd, 0 0 8px #fff; }100% { color: #0000ff; text-shadow: 0 -1px 0 #000; }}@keyframes pulsate{0%{color: #00ff00;text-shadow: 0 -1px 0 #000; }50% { color: #00ff00; text-shadow: 0 -1px 0 #444, 0 0 5px #ffd, 0 0 8px #0000ff; }100% { color: #00ff00;text-shadow:0 -1px 0 #000; }; color:#00ff00;
}
.popular-posts ul li:before {
list-style-type: none;
/*--- Posisi Nomer Urutan Editing www.bloggertutoria.com --- */
margin-right: 15px;
padding: 0.3em 0.6em;
counter-increment: popcount;
content: counter(popcount);
font-size: 16px;
background: rgba(0,0,0,.15);
color: #00ff00;
position: relative;
font-weight: bold;
font-family: georgia;
float: right;
border: 2px solid #ff0000;
box-shadow: 1px 2px 9px #00ff00; }
.popular-posts ul li {background:dodgerblue;
background:-webkit-linear-gradient(deepskyblue,dodgerblue);
background: -moz-linear-gradient(deepskyblue,dodgerblue);
background: -ms-linear-gradient(deepskyblue,dodgerblue);
background: -o-linear-gradient(deepskyblue,dodgerblue);
background: linear-gradient(deepskyblue,dodgerblue);
border-bottom: 1px dashed #0000ff;
}
.popular-posts ul li:hover {background: #09c;
background: rgba(0,0,0,.15);
background: -webkit-linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.1));
background: -moz-linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.1));
background: -ms-linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.1));
background: -o-linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.1));
background: linear-gradient(rgba(0,0,0,.2),rgba(0,0,0,.1));
border-bottom: 1px dashed rgb(105, 105, 105);
}
.popular-posts ul li a:hover {
text-decoration:none;
}
.plugins ul {
counter-reset: plugincount;
padding: 0px;
}
.plugins ul li {
border-bottom: 1px dashed #ddd;
line-height: 40px;
}
.plugins ul li:before {
content: counter(plugincount);
counter-increment: plugincount;
margin-right: 15px;
padding: 0.3em 0.6em;
background: #292D30;
border-radius: 25px;
border: 2px solid #fff000;
box-shadow: 1px 2px 9px #666;
color: #000000;
font: bold 16px georgia;
}
.plugins ul li:hover {
border-bottom: 1px dashed rgb(105, 105, 105);
}
.plugins ul li a:hover {
text-decoration:none;color:#00ff00;
}
.plugins ul li a, .popular-posts ul li a {
text-decoration:none; color:#00ff00;
}
</style>
|
Sekian dulu dari kami tentang Artikel Cara Merubah Populer Post Menjadi Nomer Urutan semoga berguna buat sobat yang mau pasang
{ 49 comentários... read them below or Comment }
1. Komentar SPAM Akan secepatnya dihapus
2. Pastikan untuk " Berlangganan Lewat Email "Atu FACEBOOK Selladrt"
3. Cek komentar masuk sebelum bertanya.
4. Link aktiv tidak akan berpungsi.
5. Bebas menyebarluaskan artikel tanpa persetujuan dari saya.
7. Bergabung dengan kami untuk menjadi member Klik " Join to Member "
tambah canggih aja mas, thanks tutornya, bnyak yg baru..
BalasHapusmet malam n weekend
trmaksih mas sama2 mas met mlm
HapusBog'nya keren banger sob.., kayak robot-robot gitu..
BalasHapushahaha..., mantap dah.. :D
iya mas ROBOTCOP hehehe trmksih mas kunjungannya
HapusRobot ijo...hehe :)
Hapuswah keren juga nih sob tampilannya.. okelah tak save dulu css nya. makasih sob...?
BalasHapussilakan sob di simpan yang rapi hehe
Hapussimpen dalam lemari mas :)
HapusWew ... Templatenya ganti-ganti mulu nih mas ... :D jadi pangling ...
BalasHapusgak ganti ko sob mas cumi di tambain dan di buangini hehe
Hapushebat mas, mantep..mkin mantep.
BalasHapussama2 mas
Hapuskeren mas broo
BalasHapustrmakasih mas bro
Hapuskalo di pasang di p ku...cocok ndak ya mas... :)
BalasHapuskopi nya mana nih... Hehe :)
dimana aja bole ms bud di tempat pemandian umum juga bole hheheheh
Hapusmas budi biasanya dikali hikhik...
Hapusmakin manteb ajah nih tutorial2 nya , ini blog nya jga template nya makin yahuut
BalasHapussama aja mas Yang namanya Template setau aq hehehe trmksih mas
Hapussiapa dulu dong...
Hapusmas adminnya :)
widgetnya lebih keren dari pada punyaku
BalasHapuswaduh malah keren punya sobat bung trmksih
Hapushadir lagi mas bro
BalasHapustrmksih sob
Hapusok mas broe..
BalasHapusmkin keren aja tmpilan dan aksesoris blog nya
iya mas mau jualan aksesoris heheheh
Hapusapalagi mas adminnya
Hapusdulunya kan bekas vokalisnya zamrut...hehe :)
keren gan blognya..makasih tutorialnya ..salam sukses
BalasHapustrmksih mas kunjunganya dan pujiannya heheh
Hapusmampir disini mas, mantep turorialnya, saya bungkus mas
BalasHapussilakan mas di simpan
Hapusbungkusnya yg pke katet dua..ya mas hehe :D
Hapuskecepatan ngetik...gara2 kebanyakan ngupi...
Hapusjd salah...
KARET dua mas...maksudnya...hehe :)
wow.. keren kreatif amat, :) .
BalasHapustrmksih dah berkunjung ya lumayan jail tanganku heheheh
HapusLebih keren & teratur ya mas populer post nya klo tampilannya seperti ini..
BalasHapusTerima kasih mas tutorialnya..
sama2 mas silakan kalu mau hehehe
Hapusbang kok edit templete yang sekrng agak susah ya? banyak yang gak ada,,gmn ya,
BalasHapustapi kayanya enakan yang sekarang D: sob Edit Html nya dari pada yang dulu
Hapusaku cari kata height untuk ngubah kolom komentar yag kata abang itu gak ada loh, bingung sama yang sekrng
Hapusmantap mas tutorial nya... saya ijin bookmark dulu,,
BalasHapusbtw, kunjungan siang mas di awal pekan...
trmksih mas dah berknjung di awal pekan
HapusJadi kelihatan nomor urutan posting yang paling banyak dikunjungi.. bagus nie sob biar pengunjung pada tertarik milih artikel itu,,
BalasHapuskeren mas bos!kapan2 bsa d coba nh
BalasHapuswah jadi lebih keren ya mas
BalasHapusCanggih banget blog ini.. :)
BalasHapushehe,aku ngerti yang dimaksud abang, mksh ya bang masukan nya recent comen nya jd keliatan agak rapih dann gak kelebihan, sebener nya dah lama aku perhatiin tapi blm dpt jawaban, mksh sekali lgi,
BalasHapus.. bagus juga ..
BalasHapuswah perlu di save nih mas pembalap... jangan lupa mampir ya mas.. maklum baru selesai ujian sekolah
BalasHapus