Cara Mengganti Nomor Urut pada Widget Populer Post Menjadi Ikon di Template VioMagz Lengkap

Disini saya akan memberi tutorian mengganti semua yang berkaitan dengan nomor urut widget popular post menjadi ikon, lebih jelasnya lihat gambar. Jika anda ingin menggunakan ikon di nomer urut pada widget popular post ini bisa di praktekkan.

CATATAN! Mungkin Tutorial Ini Tidak Berlaku Lagi Untuk Versi VioMagz V.2.8 Ke Atas!

Backup Terlebih Dahulu Template Anda

1. Masuk/Login keblogger kalian
2. Masuk kemenu Tema
3. Lalu Edit HTML
4. Cari kode ini (INGAT YANG SAYA BLOK MERAH YANG DIHAPUS) khusus langkah ke-4

.PopularPosts ul li .item-thumbnail-only:before, .PopularPosts ul li .item-content:before, .PopularPosts ul li > a:before {
   content: counter(num) !important;
   font-size: 30px;
   font-weight: 500;
   display: block;
   position: absolute;
   top: 0;
   left: 0;
   bottom: 0;
   background: linear-gradient($(link.color), #fff);
   color: #fff !important;
   width: 26px;
   padding-top: 10px;
   text-align: center;
}



5. Ganti dan tambahkan kode, maka akan menjadi :

.PopularPosts ul li .item-thumbnail-only:before, .PopularPosts ul li .item-content:before, .PopularPosts ul li > a:before {
   content: "\f101";
   font-family: FontAwesome;
   font-size: 30px;
   font-weight: 500;
   display: block;
   position: absolute;
   top: 0;
   left: 0;
   bottom: 0;
   background: linear-gradient($(link.color), #fff);
   color: #fff !important;
   width: 26px;
   padding-top: 10px;
   text-align: center;
}



Keterangan :

1. "\f101" adalah gambar ikon yang akan ditampilkan. belom tahu cara mendapatkannya klik disini.
2. font-family: FontAwesome; kode ini harus ada ketika menggunakan ikon font awesome.


6. Kalau sudah disimpan

Baca juga edit Template VioMagz Lainnya disini.
Terima Kasih!

Bagikan Artikel

Facebook Twitter Pinterest Whatsapp