-->

Situs Multi Pengetahuan Meliputi Pendidikan, Informasi Teknologi, Tutorial, Serta Pengetahuan Penting Lainya

Cara Membuat Artikel Populer Warna-warni

Cara Membuat Artikel Populer Warna-warni
Ok! Kali ini saya akan memberikan sedikit tutorial sederhana, ya hanya sederhana karena hari ini lebaran tentunya gak ada waktu buat Online hehe, jadi saya akan membuat tutorial singkat, yaitu cara membuat artikel populer warna-warni seperti blog ini.

Sebenarnya artikel populer warna-warni saya mendapatkan CSS nya di template Sang Seo punya kang mouser hehe, tapi agak saya modifikasi sedikit, agar tampilannya terlihat lebih unyu dan menarik.

Perlu anda ketahui artikel populer sangat penting untuk dipasang diblog, karena pengunjung rata-rata mencari artikel atau postingan yang unik, nah artikel populer ini juga bisa membuat pengunjung blog menjadi betah karena banyak sekali artikel-artikel yang unik dan menarik. Baiklah tidak akan banyak basa-basi lagi, mari kita simak bersama-sama bagaimana cara membuat artikel populer warna-warni ini.

  1. Masuk ke-blogger
  2. Langsung pergi ke-tata letak, tambah gadget pilih Entri Populer.
  3. Kemudian kita masuk ke Edit HTML, masukkan css dibawah ini.
.PopularPosts ul,.PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img{list-style:none;border:none;background:none;outline:none;margin:0;padding:0}
.PopularPosts ul{list-style:none;font-family:Oswald,Sans-Serif;font-size:13px;color:#fff;margin:.5em 0}
.PopularPosts ul li img{display:block;width:70px;height:70px;float:left;margin:0 15px 0 0}
.PopularPosts ul li{background-color:#eee;counter-increment:num;position:relative;margin:0 10% 0 0;padding:10px}
.PopularPosts ul li:before,.PopularPosts ul li .item-title a{font-weight:400;font-size:13px;color:inherit;text-decoration:none}
.PopularPosts ul li:before{content:counter(num);display:block;position:absolute;background-color:#555;color:#FFF;width:20px;height:20px;line-height:20px;text-align:center;bottom:5px;right:5px;margin-top:15px;border-radius:100px}
.PopularPosts ul li:nth-child(1){background-color:#F1C40F;margin-right:0}
.PopularPosts ul li:nth-child(2){background-color:#F39C12;margin-right:0}
.PopularPosts ul li:nth-child(3){background-color:#2ECC71;margin-right:0}
.PopularPosts ul li:nth-child(4){background-color:#27AE60;margin-right:0}
.PopularPosts ul li:nth-child(5){background-color:#E67E22;margin-right:0}
     4. Simpan template, dan lihat hasilnya :)

Itu lah tutorial singkat saya cara membuat artikel terpopuler warna-warni, apabila anda tidak berhasil bisa anda tanyakan dikolom komentar saya akan membantu anda untuk membuat nya, oke bro. Semoga artikel ini bermanfaat, selamat hari raya idul fitri 1935 Hijriah, mohon maaf lahir dan batin. Happy Blogging

Previous
Next Post »

12 komentar

Bryan Kirana Gaston delete July 28, 2014 at 5:11 PM

Keyen... :o

Dede Thea delete July 28, 2014 at 6:51 PM

Tentang Makanan mengucapkan Selamat Hari Raya Idulfitri 1435 H.mohon maaf lahir dan batin Mas Munawir......untuk tutonya disimak dulu yah hehehe

Munawir Alfikri delete July 28, 2014 at 6:59 PM

terima kasih mas :)

Munawir Alfikri delete July 28, 2014 at 6:59 PM

Iya mas dede :)
makasih udah berkunjung yaa

ilham efendi delete July 29, 2014 at 12:20 AM

udah lama mau pake populler post yang kaya gini , ijin pake di blog ane gan

Mas Yadi delete July 29, 2014 at 6:57 AM

wah bisa tambah keyen nih populer pos nya :D

Uda Awak delete July 29, 2014 at 8:22 AM

Wah, sepertinya bagus digunakan untuk template kompi ajaib ini ya mas?
Oh, selamat hari raya idhul fitri 1435, maaf lahir bathin ya mas...

Munawir Alfikri delete July 29, 2014 at 8:23 AM

Hehe silahkan deh mas ilham :)

Munawir Alfikri delete July 29, 2014 at 8:23 AM

Hehehe iya tambah imut ya gan popular post nya

Munawir Alfikri delete July 29, 2014 at 8:24 AM

Iya mass seperti nya begitu deh heheh :D
Iya sama-sama mas saya juga :)

androidism delete July 29, 2014 at 9:11 PM

wah keren nih artikelnya, jadi eye catching ya artikel populernya :D
o ya ane dah follow g+ nya, follback ya :P

Munawir Alfikri delete July 29, 2014 at 9:13 PM

wahh makasih ya :)
Oke udah di follback kok :-d

Apa tanggapan anda tentang artikel diatas?

 

Contact Form

Name

Email *

Message *