Cara Pasang Widget Popular Post Berwarna Warni


Popular post adalah salah satu widget yang disediakan oleh blogger bagi memaparkan posting yang popular pada sesuatu bulan,minggu atau sepanjang masa.Anda boleh memilih bagaimana ia akan dipaparkan.Tutorial ini adalah cara untuk mengubahsuai paparannya dalam bentuk yang berwarna warni


Langkah bagi membuatnya:

1.Masuk ke blogger dan masukkan widget popular post pada blog anda
   Pada dashboard pilih Layout>>Add A gadget



2.Pilih popular post dari senarai tersebut dan namakan widget tersebut dengan perkataan yang diingini.


3.Seterusnya pada template pilih Edit HTML

4.Cari kod ]]></b:skin> gunakan CTRL+F(rujuk sini)
Kemudian letakkan kod ini diatasnya

#PopularPosts1 ul{margin:0;padding:4px 0;list-style-type:none}
#PopularPosts1 ulli{position:relative;margin:4px 0;border:0;padding:10px}
#PopularPosts1 ulli:first-child{background:#ff4c54;width:90%}
#PopularPosts1 ulli:first-child:after{content:"1"}
#PopularPosts1 ulli:first-child + li{background:#ff764c;width:87%}
#PopularPosts1 ulli:first-child + li:after{content:"2"}
#PopularPosts1 ulli:first-child + li + li{background:#ffde4c;width:84%}
#PopularPosts1 ulli:first-child + li + li:after{content:"3"}
#PopularPosts1 ulli:first-child + li + li + li{background:#c7f25f;width:81%}
#PopularPosts1 ulli:first-child + li + li + li:after{content:"4"}
#PopularPosts1 ulli:first-child + li + li + li + li{background:#33c9f7;width:78%}
#PopularPosts1 ulli:first-child + li + li + li + li:after{content:"5"}
#PopularPosts1 ulli:first-child + li + li + li + li +li{background:#7ee3c7;width:75%}
#PopularPosts1 ulli:first-child + li + li + li + li + li:after{content:"6"}
#PopularPosts1 ulli:first-child + li + li + li + li + li +li{background:#f6993d;width:72%}
#PopularPosts1 ulli:first-child + li + li + li + li + li + li:after{content:"7"}
#PopularPosts1 ulli:first-child + li + li + li + li + li + li +li{background:#f59095;width:69%}
#PopularPosts1 ulli:first-child + li + li + li + li + li + li + li:after{content:"8"}
#PopularPosts1 ulli:first-child + li + li + li + li + li + li + li +li{background:#c7f25f;width:66%}
#PopularPosts1 ulli:first-child + li + li + li + li + li + li + li + li:after{content:"9"}
#PopularPosts1 ulli:first-child:after,
#PopularPosts1 ulli:first-child + li:after,
#PopularPosts1 ulli:first-child + li + li:after,
#PopularPosts1 ulli:first-child + li + li + li:after,
#PopularPosts1 ulli:first-child + li + li + li + li:after,
#PopularPosts1 ulli:first-child + li + li + li + li + li:after,
#PopularPosts1 ulli:first-child + li + li + li + li + li + li:after,
#PopularPosts1 ulli:first-child + li + li + li + li + li + li + li:after,
#PopularPosts1 ulli:first-child + li + li + li + li + li + li + li + li:after{position:absolute;top:20px;right:-15px;border-radius:50%;background:#353535;width:30px;height:30px;text-align:center;font-size:28px;color:#fff}
#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:70px;height:70px;}
#PopularPosts1 ul li a{font-size:13px;color:#444;text-decoration:none}
#PopularPosts1 ul li a:hover{color:#222;text-decoration:none}
#PopularPosts1 img{
-moz-border-radius: 130px;
-webkit-border-radius: 130px;
border-radius: 130px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
padding:4px;
border:1px solid #fff !important;
}
#PopularPosts1 img:hover {
border-radius: 0 0 0 0;
-moz-transform: scale(1.2) rotate(-711deg) ;
-webkit-transform: scale(1.2) rotate(-711deg) ;
-o-transform: scale(1.2) rotate(-711deg) ;
-ms-transform: scale(1.2) rotate(-711deg) ;
transform: scale(1.2) rotate(-711deg) ;
}


5.Klik pada preview template untuk melihat paparannya.
6.Klik pada save template




Artikel ini hanyalah simpanan cache dari url asal penulis yang berkebarangkalian sudah terlalu lama atau sudah dibuang :

http://teknikbuatblog.blogspot.com/2013/09/cara-pasang-widget-popular-post.html

Kempen Promosi dan Iklan
Kami memerlukan jasa baik anda untuk menyokong kempen pengiklanan dalam website kami. Serba sedikit anda telah membantu kami untuk mengekalkan servis percuma aggregating ini kepada semua.

Anda juga boleh memberikan sumbangan anda kepada kami dengan menghubungi kami di sini
Cara Pasang Widget Related Post Nrelate

Cara Pasang Widget Related Post Nrelate

papar berkaitan - pada 12/11/2021 - jumlah : 164 hits
Sebelum ini Admin ada membuat posting tentang cara memasang artikel terkait Nrelate adalah satu widget yang serupa dengan tetapi lebih menarik kerana anda mempunyai pilihan bagi mengubah setting pada widget ini Terdapat enam styles widget y...
Cara Buat Widget Popular Posts Dengan Animasi Gambar Berputar

Cara Buat Widget Popular Posts Dengan Animasi Gambar Berputar

papar berkaitan - pada 12/11/2021 - jumlah : 172 hits
Widget popular posts dengan animasi gambar berputar ini sangat cantik dan menarik sekali terlebih lagi jika dipasang di blog anda yang pasti pengunjung blog akan teruja dan tertarik ingin membuatnya juga Tentunya penampilan blog yang cantik...
Widget Popular Post Hitam Dan Merah

Widget Popular Post Hitam Dan Merah

papar berkaitan - pada 12/11/2021 - jumlah : 175 hits
Sebelum ini admin pernah membuat artikel mengenai Kali agak berbeza sedikit kerana ia berwarna hitam dan merah serta akan bergerak bila dilalukan mouse diatas nya cara memasangnya pada blog 1 Masuk ke blogger dan masukkan widget popular pos...
Cara Mudah Pasang Bismillahirrahmanirrahim Pada Semua Posting

Cara Mudah Pasang Bismillahirrahmanirrahim Pada Semua Posting

papar berkaitan - pada 17/11/2021 - jumlah : 223 hits
Masih di Variasi Blogger share Cara Mudah Pasang Bismillahirrahmanirrahim pada semua posting cekidot Silahkan Log in terlebih dahulu di blogs sobat kemudian klik Template klik Edit HTML lalu sobat Copy Paste kode script di bawah ini dan sim...
Cara Mudah Pasang Jam Dan Tanggal Di Blog

Cara Mudah Pasang Jam Dan Tanggal Di Blog

papar berkaitan - pada 17/11/2021 - jumlah : 258 hits
Masih di Variasi Blogger share Cara Mudah Pasang Jam dan Tanggal di blog cekidot Silahkan sobat Copy Paste kode script di bawah ini dan simpan di blog sobat diantaranya Untuk kode script widget Hari Tanggal Bulan dan Tahun script var mydate...
Cara Pasang Pop Up Facebook Like Box Dengan Timer

Cara Pasang Pop Up Facebook Like Box Dengan Timer

papar berkaitan - pada 12/11/2021 - jumlah : 222 hits
Facebook like box ini akan muncul sebaik sahaja pengunjung blog anda ini mempunyai kaunter masa sebelum ia hilang secara automatik dan boleh juga ditutup dengan butang close yang adaCara memasangnya 1 Masuk ke blogger2 Pada dashboard pilih ...
Cara Memasang Widget Di Blogs

Cara Memasang Widget Di Blogs

papar berkaitan - pada 17/11/2021 - jumlah : 209 hits
Bagaimana cara memasang atau menambahkan widget di Blogspot dari pertanyaan tersebut mungkin sebagian para pakar blogger profesional pastinya sudah pada tau namun bagaimana jika ada seorang blogger pemula yang baru belajar di blogspot Mungk...
Cara Pasang Meta Tag Yang Power Punya

Cara Pasang Meta Tag Yang Power Punya

papar berkaitan - pada 12/11/2021 - jumlah : 206 hits
Berjumpa lagi di blog Johan Rakyat dan saya yang tak pernah bosan untuk berkongsi tips dengan anda semua sebelumnya saya sudah memposting artikel tentang beberapa jenis meta tag dan dan sekarang saya akan memposting artikel tentang ini sang...
Cara Pasang Atap Spandek

Cara Pasang Atap Spandek

papar berkaitan - pada 11/11/2021 - jumlah : 459 hits
Cara Pasang Atap Spandek atau juga yang dikenal dengan atap gelombang spandek karena permukaannya yang bergelombang terbuat dari baja bertegangan tarik tinggi mempunyai daya tahan 4 x lebih tinggi dibandingkan dengan baja biasa Baja dengan ...
Perbelanjaan Menggunakan Kereta Proton E Mas 7

Resipi Kuih Peria Yang Sedap Mudah Tip Bentuk Jadi Cantik Guna Jaring Ini

Pak Lah To Be Laid To Rest In Warriors Mausoleum

Biografi Tun Abdullah Ahmad Badawi

Back To The Future Why Y2k Fashion Is Making A Major Comeback

Unleash Your Inner Artist Learn How To Paint

Mastering The Road Learn Driving Theory For A Solid Foundation

Sharing The Road With Trucks A Safety Guide For Drivers


echo '';
Info Dan Sinopsis Drama Berepisod Dendam Seorang Madu Slot Tiara Astro Prima

10 Fakta Biodata Amira Othman Yang Digosip Dengan Fattah Amin Penyanyi Lagu Bila Nak Kahwin

5 Tips Macam Mana Nak Ajak Orang Kita Suka Dating Dengan Kita

Info Dan Sinopsis Drama Berepisod Keluarga Itu Slot Lestary TV3

Bolehkah Manusia Transgender Mencapai Klimaks Selepas Bertukar


Keladi Sayur Setelah 3 Bulan Di Raised Bed

Cultural Rhythms Festival Showcases Global Talents At Harvard

Nerdywave Tees For Geeks Gamers The Slightly Supernatural

Designing With Heart Eurisko S Ui Ux Touch Transforms Lebanon

Michelle Yeoh Berhijab Tercantik Di Funeral Negara Pak Lah Untuk Memberi Hormat Terakhir

Jualan Mega Gatti Sports Rawang Barangan Sukan Berkualiti Dengan Diskaun Hebat