WordPress’te Font Awesome İkonları Nasıl Kullanılır?

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ı.

Wordpress Font Awesome IkonlariFont 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ı.

  1. Font Awesome web sitenize girin ve Download alanından kütüphaneyi indirelim.
  2. Tema klasörünün içnde CSS dosyalarının bulunduğu klasöre dosyaları atalım.
  3. 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.

<i class="fa fa-facebook"></i>

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.

Popular Eğitimler

WordPress Admin Paneli Giriş Linki Nedir?

WordPress’i yeni yüklediniz ve sitenizi oluşturmaya başlamak için heyecanlısınız. Ama sonra nasıl…

WordPress Yorum Başlığını Değiştirme

WordPress içeriklerinize yorum girişlerini açtıysanız yorum formunun üzerinde Şimdi Cevap Yazın ya…

WordPress Admin Paneli Giriş Sayfası Yönlendirme

WordPress’te admin giriş sayfasına wp-admin’den ulaşabiliyorsunuz. Sizden kullanıcı adı ve parola istiyor…

WordPress’te Arama ve Değiştirme

Phpmyadmin’de arama ve aranılan kelimeyi değiştirme işlemi nasıl yapılır?

WordPress Ping Servisleri 2018 Güncel

WordPress Ping servisleri yeni eklediğiniz içeriklerinizin hızlı bir şekilde arama motorları tarafından…

cPanel ile 1 Dakikada WordPress Kurulumu

Bu eğitimde WordPress kurulumu yapacağız, ama WordPress’i cPanel üzerinden kuracağız. Bir hosting…