WordPress’te Eklentisiz Font Awesome Kullanımı
Web sitenizi hazırlarken ikonlarla canlılık katmak isterseniz, ikonları imaj olarak sitenize yüklemenin dışında Font Awesome kullanarak font gibi davranmalarını sağlayabilirsniz. Font Awesome kütüphanesi geniş bir içeriğe sahip ve bir web sitesinde ihtiyacınız olabilecek birçok ikonu barındırıyor. Facebook, Twitter gibi sosyal medya ikonları başta olmak üzere ok gibi yönlendirmeler ve sayamayacağım birçok ikona sayfanızda yer verebilirsiniz. Vektör görseller gibi bozulmadan boyutlandırma yapabilmesi de artısı.
Font Awesome İkonları WordPress’te Nasıl Kullanılır?
WordPress’e eklentisiz Font Awesome nasıl eklenir, bundan bahsedeceğiz. Tabii, WordPress olarak anlatacağım ama, WordPress kullanmıyorsanız kendi web sitenize de aynı mantıkla entegre edebilirsiniz bu ikon fontları.
- Font Awesome web sitenize girin ve Download alanından kütüphaneyi indirelim.
- Tema klasörünün içnde CSS dosyalarının bulunduğu klasöre dosyaları atalım.
- WordPress’te header.php’yi açıp, font-awesome-min.css dosyasını aşağıdaki kod ile çağıralım.
Font Awesome ikonları nasıl kullanılır?
Yukarıdaki kodu sitemize ekledikten sonra sayfaları kodlarken Font Awesome’ın nasıl kullanıldığını da göstereyim. Font Awesome kullanmak için öncelikle hangi ikonu kullanmak istediğimiz bulalım. Font Awesome ikonlarının bulunduğu bu adreste hangi ikonun hangi koda karşılık geldiğini görebilirsiniz. Burada kullanmak istediğiniz ikonları aratıp kodlarını görebilirsiniz. Ben şimdi örnek olması açısından Facebook ikonunun nasıl kullanıldığını göstereceğim.
Font Awesome kod şablonu aşağıdaki gibidir. Fa harflerinden sonra da ikonun ismini yazarak seçtiğiniz ikonun görünmesini sağlayabilirsiniz.
Font Awesome ikonlarının web sitemizde görünmesi işte bu kadar kolay. i etiketine inline stil ekleyebilir ya da fa sınıfı gibi başka sınıflar da ekleyerek style.css dosyası üzerine düzenleme yapabilirsiniz. font-size ile ikonları büyüttüğünüzde, imajlar gibi bozulma olmayacağından rahatlıkla büyütebilirsiniz. Hatta ikonların renklerini bile değiştirmeniz mümkün.
