Font Awesome Nedir ? Nasıl Kullanılır ?
Font Awesome Nedir ?
Benimde kullandığım küçük grafikler diyebiliriz onlara güzel olan yanı ise siteyi hiç yormaması ve bir yazı karakteri gibi davranması font kütüphaneside oldukça geniş ben kendime uygun olanları seçmek için oldukça zorlandım :)
Font Awesome Kulanırsak Nolcak ?
Yazımın başındada bir nebze anlattığım gibi artık eski tip jpg, gift gibi sitenizi yoran görsellere ihtiyacınız yok Font Awesome sayesinde oldukça güzel işler çıkarabilirsiniz. Ama avantajlarını bir liste yapamadan duramayız ;
- Çok geniş bir kütüphaneye sahip
- Grafik olmadığı için sayfa açılma hızı artıyor
- Mobil cihazlarada uyumlu
- İkonlar birbirine çok uyumlu o yüzden sırıtmıyorlar
Font Awesome Blogger'da Nasıl Kullanılır ?
Bu ikonları sizde kullanmak istiyorsanız önce bloğunuza bu ikonları tanıtmalısınız bunun için hemen Şablon > HTML'yi Düzenle diyerek <head> kodunun altına aşağıdaki kodları yapıştırıyoruz.
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet" />
Şimdi font awesome'ın ikon kütüphanesini ziyaret edip beğendiğimiz ikonun üstüne tıklayıp kodunu alıyoruz.örnek olarak bende şu kodu seçtim
<i class="fa fa-futbol-o"></i>
Seçtiğiniz ikon şu şekilde gözüküyor İkonların boyutunu değiştirmekte eklemek kadar kolay
<i class="fa fa-futbol-o fa-lg"></i>
<i class="fafa-futbol-o fa-2x"></i>
<i class="fa fa-futbol-o fa-3x"></i>
<i class="fa fa-futbol-o fa-4x"></i>
<i class="fa fa-futbol-o fa-5x"></i>
Boyutlarıda bu şekilde <i class="fafa-futbol-o fa-2x"></i>
<i class="fa fa-futbol-o fa-3x"></i>
<i class="fa fa-futbol-o fa-4x"></i>
<i class="fa fa-futbol-o fa-5x"></i>
Şimdide bu güzel nimetlerden faydalanarak güzel bir sosyal ikon menüsü yapalım
<a href="#"><i class="fa fa-facebook fa-lg"></i></a>
<a href="#"><i class="fa fa-twitter fa-lg"></i></a>
<a href="#"><i class="fa fa-instagram fa-lg"></i></a>
<a href="#"><i class="fa fa-google-plus fa-lg"></i></a>
<a href="#"><i class="fa fa-linkedin fa-lg"></i></a>
<a href="#"><i class="fa fa-pinterest fa-lg"></i></a>
<a href="#"><i class="fa fa-youtube fa-lg"></i></a>
<a href="#"><i class="fa fa-rss fa-lg"></i></a>
Sosyal medya ikonları daha bi hoş durdu sanki<a href="#"><i class="fa fa-twitter fa-lg"></i></a>
<a href="#"><i class="fa fa-instagram fa-lg"></i></a>
<a href="#"><i class="fa fa-google-plus fa-lg"></i></a>
<a href="#"><i class="fa fa-linkedin fa-lg"></i></a>
<a href="#"><i class="fa fa-pinterest fa-lg"></i></a>
<a href="#"><i class="fa fa-youtube fa-lg"></i></a>
<a href="#"><i class="fa fa-rss fa-lg"></i></a>
Evet Font Awesome bu şekilde kullanılır artık neler yapabileceğiniz hayal gücünüze kalmış Font Awesome'nin Blogger'de kullanılması beni çok mutlu etti birdahaki yazımda görüşmek üzere...
çok teşekkürler yararlı bilgi olmuş
YanıtlaSilBiz Teşekkür ederiz Berkay Bey.
Sil