Cara Membuat popular pos warna warni dengan mudah

Cara Membuat popular pos warna warni dengan mudahSering kita melihat beberapa blog atau website yang memiliki widget popular post nya yang berwarna warni, kadang kita punya keinginan untuk membuat nya, atau hanya untuk coba-coba memasang kan nya di blog kita, kalau cocok kita pasang selama nya kalau tidak cocok ya dibuang lagi.

Tidak ada salah nya kita mencoba atau sekedar belajar bereksperimen saja, karena saya yakin sebagai blogger pemula seperti saya senang mempelajari hal yang unik-unik dalam mendesain tampilan blog, tampilan blog yang indah tentu membuat kita dan pengunjung blig kita merasa betah dan berlama-lama mengunjungi blog kita.

Nah jika anda mau mencobanya di blog anda masing-masing, maka ikutilah langkah langkah berikut ini secara langsung

Langsung saja ke TKP jika anda ingin mencoba nya silahkan ikuti cara nya seperti dibawah ini.

 Cara Membuat popular pos warna warni dengan mudah


1. langkah yang pertama seperti biasa anda masuk ke akun blog anda dahulu atau ke akun blogger anda.

2. Cari tata letak di pengaturan blog anda kemudian  Klik tata letak, kemudian  tambahkan widget popular post nya terserah mau ditaruh sebelah mana umum nya sih di sebelah kanan.

3. Kemudian Pada pengaturan  popular post hilangkan centang thumbnail atau gambar dan seting minimal 9 atau 10 tampilan popular post., tergantung anda sendiri.

4.Setelah itu klik simpan dan kemudian kita ke tahap berikut nya untuk setting di template nya dengan cara edit template.

4. Selanjutnya  kita ke pengaturan edit template klik  edit HTML

5. Cari lah kode Seperti berikut ini ]]></b:skin> setelah ketemu tempatkan kode berikut dibawah ini tepat diatas kode ]]></b:skin>   Utuk mempermudah pencarian bisa gunakan tombol  CTRL + F

6.Klik pratinjau template template, jika sudah cocok silahkan simpan template

Berikut ini adalah kode nya

#PopularPosts1 ul li:first-child:after, 
#PopularPosts1 ul li:first-child + li:after, 
#PopularPosts1 ul li:first-child + li + li:after, 
#PopularPosts1 ul li:first-child + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li:after, 
#PopularPosts1 ul li:first-child + li + li + li + li + li:after, 
#PopularPosts1 ul li:first-child + li + li + li + li + li + li:after, 
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after, 
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after, 
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{position:absolute;top:10px;right:5px;border-radius:50%;border:2px solid #ccc;background:#353535;-webkit-box-shadow:0px 0px 5px #000;-moz-box-shadow: 0px 0px 5px #000;width:30px;height:30px;line-height:1em;text-align:center;font-size:28px;color:#fff} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li {background:#DF01D7;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"} 
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{background:#B041FF;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"} 
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li +li{background:#F52887;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{content:"10"} #PopularPosts1 ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:90%} 
#PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"} 
#PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"} 
#PopularPosts1 ul li:first-child + li + li + li + li{background:#33c9f7;width:90%} 
#PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"} 
#PopularPosts1 ul li:first-child + li + li + li{background:#c7f25f;width:90%} 
#PopularPosts1 ul li:first-child + li + li + li:after{content:"4"} 
#PopularPosts1 ul li:first-child + li + li{background:#ffde4c;width:90%} 
#PopularPosts1 ul li:first-child + li + li:after{content:"3"} 
#PopularPosts1 ul li:first-child + li{background:#ff764c; width:90%} 
#PopularPosts1 ul li:first-child + li:after{content:"2"} 
#PopularPosts1 ul li:first-child{background:#ff4c54 ;width:90%} 
#PopularPosts1 ul li:first-child:after{content:"1"} 
#PopularPosts1 ul{margin:0;padding:0px 0;list-style-type:none} 
#PopularPosts1 ul li{position:relative;margin:6px 0;border-radius:25px 0px 25px 0px;border:2px solid #f7f7f7;-webkit-box-shadow:3px 3px 3px #000;-moz-box-shadow: 3px 3px 3px #000;padding:10px}

Tapi keberhasilan nya tergantung jenis template yang dipergunakan ada juga template tertentu yang tidak bisa memakai trik ini.

Demikianlah artikel kali ini tentang  Cara Membuat popular pos warna warni dengan mudah, semoga membantu dan bermanfaat bagi kita yang membutuhkan nya, terimakasih.
Selamat mencoba dan semoga berhasil.


Subscribe to receive free email updates:

0 Response to " Cara Membuat popular pos warna warni dengan mudah"

Post a Comment

Terimakasih telah berkunjung,Berkomentarlah dengan sesuai topik dilarang berkomentar dengan tidak sopan, tidak senonoh ,pornografi dan Sara,menyertakan link aktif akan otomatis terhapus