Cara Mengganti Icon Font Awesome Artikel Terbaru Template VioMagz


Pada template VioMagz buatan Mas Sugeng yang standar terdapat script Artikel Terbaru yang bisa kamu pasang di blog. Biasanya setelah dipasang akan muncul widget Artikel Terbaru dengan tampilan icon Font Awesome pencil square. Nah bagaimana kalau kamu ingin merubahnya menjadi icon Font Awesome yang lain? Pada artikel ini saya akan memberikan cara singkat dan mudah mengganti icon Font Awesome pada template VioMagz.

Apa Itu Icon Font Awesome?

Icon Font Awesome adalah icon yang biasa digunakan oleh Web Developer untuk mempercantik tampilan web. Font Awesome memberikan kamu kemudahan dalam menggunakan icon web dalam bentuk vector. Font Awesome selayaknya penggunaan font face pada umumnya yang dapat dengan mudah disesuaikan dengan berbagai gaya css seperti ukuran, warna, drop shadow dan lain-lain. Situs yang menyediakan icon Font Awesome adalah fontawesome.com, di sana kamu bisa memilih icon yang kamu suka.

Cara Mengganti Icon Font Awesome Artikel Terbaru Template VioMagz

Sebenarnya untuk mengganti icon pada artikel terbaru nggak terlalu sulit, hanya perlu inspect element dan mengganti kode icon font awesome pencil square dengan icon baru yang telah dipilih di situs fontawesome di atas. Tapi karena saat inspect element dilakukan banyak orang yang nggak paham dengan kode icon font awesome tersebut, karena biasanya kode icon font awesome berbentuk script. Awalnya saya juga kesulitan untuk menggantinya, tapi setelah dapat pencerahan dari grup Blogger, akhirnya icon artikel terbaru saya berhasil diganti.


  • Pertama-tama lakukan inspect element pada widget artikel terbaru kamu, tepat pada icon pencil square, atau kalau ingin cepat, kamu bisa langsung masuk ke sini, untuk mengetahui kode dari icon pencil square. ATAU kalau nggak mau repot-repot, kode dari pencil square adalah f14b!
  • Setelah tahu kode dari pencil square tadi, langsung saja masuk ke menu THEME - EDIT HTML - CTRL F - paste atau ketik kode tersebut.
  • Nanti ada dua kode f14b yang muncul, ganti kedua kode tersebut dengan kode icon font awesome pilihan kamu. Setelah itu pilih SAVE THEME.
  • Sampai di sini icon artikel terbaru kamu sudah berganti dengan icon yang baru.
Mengganti icon pencil square pada artikel terbaru template VioMagz sebenarnya nggak terlalu penting, karena nggak ngaruh juga dengan SEO dan lain-lain, tapi karena berhubung template VioMagz sudah banyak yang menggunakan dan saya sendiri nggak mau blog ini terlihat "pasaran", makanya saya ganti icon tersebut.

Kesimpulan

Untuk mengganti icon font awesome artikel terbaru template VioMagz hanya dibutuhkan beberapa cara singkat dan nggak perlu menambah script pada template. Awalnya saya butuh beberapa jam untuk menggantinya, karena kode-nya berbeda dengan kode yang biasa digunakan pada icon navigasi. Namun setelah diberitahu oleh seorang teman di grup, akhirnya dalam waktu menit icon artikel terbaru sudah bisa diganti. Nah, cukup sekian artikel cara mengganti icon font awesome artikel terbaru template VioMagz, semoga bisa bermanfaat bagi teman-teman.

1 Komentar

  1. Gan kasih tau cara yang paling penting bagaimana caranya mengganti font awesome menjadi SVG icon. Para developer web umumnya setuju font awesome itu merugikan kecepatan halaman sampai 25%.

    Tengkiyu Gan untuk artikelnya

    BalasHapus

Posting Komentar

Lebih baru Lebih lama