Mengingat template saat ini sudah banyak menggunakan font awesome dan saya juga sering sekali mengalami Icon Font Awesome tidak Muncul, berikut ini Cara mengatasinya yang saya dapet dari blog sahabat. Font Awesome adalah icon pada website atau blog yang bekerja karena suatu kode CSS.
Atau lebih jelasnya bisa baca ini :

 Font Awesome” adalah kumpulan icon yang telah dibuat sedemikian rupa, dan menggunakan system “Font Icon” yang memungkinkan kita untuk merubah warna dan ukuran font dengan menggunakan CSS tanpa takut Icon menjadi Pecah-pecah dan tantunya lebih ringan daripada Image Icon.

Biasanya Font Awesome di gunakan pada Social Media Button di blog atau bisa juga home icon untuk beranda blog, Tombol Back To Top dan masih banyak lagi.

 Jika error, Font Awesome hanya terlihat sebagai persegi panjang atau kotak. Jika di blog agan terdapat icone berupa kotak kotak maka bisa di pastikan bahwa Font Awesome pada blog agan itu error.

 Nah setelah tau pengertian dari Font Awesome kita lanjut ke topik utama kita yaitu :

Cara Mengatasi Font Awesome Yang Tidak Muncul
Pada tutorial kali ini saya akan membahas Cara Mengatasi Icon Font Awesome Yang Tidak Muncul pada template Evo Magz Free Templates. Kenapa saya membahasnya pada template ini ? Karna pada blog saya yang lain yaitu chord.andhika-notes.com mengalami error pada Font Awesome nya.

Icon Font Awesome Tidak Muncul
Icon Font Awesome Tidak Muncul
Sebenarnya sih bukan error karena Font Awesomnya itu sendiri. Tetapi, pada sebagian browser ada beberapa kesalahan pada kode HTML nya sehingga tidak semua Browser seperti Mozila Firefox, Google Chrome, Safari, Opera dll support pada Font Awesome.
Apa lagi pada browser keluaran terbaru (New Version) dan disini kita akan membahas cara memperbaikinya.
Dan pada Tutorial saya kali ini Mengatasi error pada semua versi (all version) Font Awesome.

 Pertama masuk pada akun blogger kalian masing masing. Supaya cepat silahkan masuk ke blogger lewat sini => blogger login.
Setelah agan login pada blog agan masing masing, Pilih menu Template lalu di lanjutkan dengan memencet tombol Edit HTML. *seperti gambar di bawah

Edit HTML
Edit HTML

 Jika sudah, cari kode yang serupa dengan kode di bawah:

<link href='//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet'/>
link warna hijau adalah versi Font Awesome dan tidak semua template menggunakan Font Awesome dengan versi yang sama dan bisa jadi blog saya dengan blog agan Font Awesomenya berbeda. Tetapi tidak apa karena tidak terlalu bermasalah karna tutorial ini adalah untuk Font Awesome all version

 jika belum ketemu silahkan gunakan tombol CTRL ditambah tombol F pada keyboard atau yang lebih kita kenal dengan CTRL+F dengan menegtik font-awesome pada kotak pencarian.

 Lalu ubah kode HTML di atas menjadi seperti :

<link href='https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet' type='text/css'/>
Lalu save template dan Font Awesome pada blog anda pun sudah normal kembali.

 Dan ternyata :o
Tidak munculnya icon Font Awesome adalah bukan karena browser, template, domain ataupun blog kalian. Tetapi kurangnya beberapa kode HTML. Dan setelah di perbaiki blog saya pun kembali normal.

 Sekian postingan tentang Cara Mengatasi Icon Font Awesome Yang Tidak Muncul. Semoga bermanfaat dan sampai berjumpa kembali pada postingan selanjutnya

sumber: http://www.andhika-notes.com