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 : 137 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 : 148 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 : 149 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 : 199 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 : 220 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 : 180 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 : 184 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 : 141 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 : 390 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 ...
Tattoos Raised And Itchy

Tattoos Portland Maine

Kisah Adv 160 Pengajaran Dari Bateri Lemah

Flexibility In Business Operations

Kawan Kawan Cik B Sebaya Dato Seri Vida

Umno Youth To Protest Extra Hours For Civil Servants Working Shifts

Kempen Hartanah Bumiputera Khas Untuk Pembeli Bumiputera Mendapatkan Rumah Dengan Tawaran Giler Menarik

Biodata Hael Husaini 2 Kali Juara Ajl Dan Perjalanan Dalam Industri Seni


echo '';
Senarai Lagu Tugasan Konsert Minggu 1 Gegar Vaganza 2024 Musim 11

Info Dan Sinopsis Drama Berepisod Dhia Kasyrani Slot Akasia TV3

Biodata Terkini Reshmonu Peserta Gegar Vaganza 2024 Musim 11 GV11 Penyanyi Lagu Hey Waley

Gegar Vaganza 2024 GV 11 Hadiah Tiket Peserta Juri Format Pemarkahan Dan Segala Info Tonton Live Di Astro Ria Dan Sooka

6 Janji Donald Trump Kalau Dia Naik Jadi Presiden Semula


Jangan Risau Jika Tak Terkenal

Company Director Scammed Of Over Rm1mil By Inspector Harun

Bila Pn Buat Pusingan U

Let S Not Return To The Old Ways Of Tight Media Control

Bank Islam Berwajah Baru Melalui Aplikasi Dan Web

Lava168 1