Favicon Nedir?
Tarayıcılarımızda sekmelerin başında gördüğümüz küçük simgelerdir. Aynı zamanda bunlar site simgesi, sekme ikonu, favikon gibide adlandırılmaktadır.
WordPress ve HTML gibi tüm yazılımlarda her ne kadar zahmetli yada zor bir işlem gibi görünse de web sitesine favicon eklemek oldukça kolaydır. Bu yazımızda WordPress ve HTML sitelere favicon ekleme yollarını detaylı bir şekilde anlatıyor olacağız.
WordPress Siteye Favicon Nasıl Eklenir?
WordPress yada HTML kodlarına çok hakim olmayan arkadaşlar genellikle siteye favicon yapma gibi ihtiyaçlarını eklentiler ile çözüyorlar. Ancak sadece küçük bir kod ile 2-3 dakikada halledilebilecek bir uygulama için eklenti kurarak siteye yük bindirmek doğru değildir.
WordPress siteler ne kadar az eklenti ile tasarlanırsa o kadar hızlı olabileceği gibi aynı zamanda güvenlik açısından daha az risk oluşturmaktadır. WordPress kullanıyorsanız aşağıdaki yöntemlerle kolayca favicon ekleyebilirsiniz.
1. Yöntem
WordPress temaların bir çoğunda favicon ekleme bölümü olabiliyor. Bunun için wp-admin’de görünüm > özelleştir kısmına giriş yapabilir burada site kimliği sekmesine (temaya göre değişiklik gösterir) yada diğer sekmelere bakarak favicon (site ikonu) kısmı olup olmadığına bakın. Özelleştir kısmında yoksa tema ayarlarında da yer alabilir.
Özelleştir bölümünde bu şekilde bir alan mevcutsa “Site simgesini seç” tıklayarak bilgisayarınızda bulunan ico uzantılı favicon görselini seçin ve kaydedin. Aslında burada png yada jpg gibi dosyaları da yükleyebilirsiniz ancak usule uygun olması faviconun daha hızlı görünmesi ve sitenizi performans bakımından kasmaması için avantaj sağlar. (Hazırladığınız bir görsel nasıl .ico yapılır, aşağıda anlattık)
Bu şekilde eklenmiş olacaktır. Tarayıcıda ve arama motorlarında görünmesi için biraz zaman gerekebilir. WordPress sitenizde cache eklentileri yada cloudflare varsa önbelleği silmeniz gerekebilir.
2. Yöntem
Eğer temanızın ayarlarında yada özelleştir kısmında favicon eklemek için herhangi bir bölüm mevcut değilse faviconu kod ile de oldukça kolay bir şekilde ekleyebilirsiniz.
Favicon görselinizi public_html yada httpdocs gibi (hostunuza göre değişiklik gösterebilir) sitenin bulunduğu anadizine atarak aşağıda ki kodu sitenizin <head></head> kodları arasına koymanız gerekmektedir.
<link rel="icon" href="favicon.ico" type="image/x-icon" />Eğer ben wordpress kullanıyorum kolaylık olsun diye ortam kısmından görseli yüklemek istiyorum ana dizine koymak istemiyorum diyorsanız ortam bölümünden görseli ekledikten sonra üstteki href=”favicon.ico” kısmına yüklediğiniz ortam urlsini koyabilirsiniz. Bu alandan ico uzantısına izin verilmez o yüzden .png yada .jpg gibi formatlarda yükleme yapabilirsiniz.
Örnek:
<link rel="icon" href="https://internetsitesikurmak.net/wp-content/uploads/2023/04/favicon-32x32-1.png" type="image/x-icon" />Favicon HTML Siteye Nasıl Eklenir?
Hemen üstte bahsettiğimiz 2. yöntemle HTML sitenize favicon ekleyebilirsiniz. Ancak bu kodu HTML sitelerde sadece index.html değil bütün .html formatına sahip sayfalarınıza ayrı ayrı <head></head> tagları arasına eklemeniz gerektiğini unutmayın. Yoksa site ikonu sadece eklediğiniz sayfalarda görünüp, eklemediğiniz sayfalarda görünmeyecektir.
Online Favicon Generator ile Görsellerinizi .ico Formatına Dönüştürebilirsiniz
Bir görsel hazırladığınızı yada internetten bulduğunuzu varsayalım. Bunu .ico formatına dönüştürmek oldukça kolay. Sadece bir kaç saniye içinde .ico formatında bir favicon hazırlayabilirsiniz.
Öncelikle https://www.favicon-generator.org/ sitesine gidelim. Açılacak olan sayfada yükleme alanında “Dosya seç” butonuna tıklayarak cihazımızda ki favicon yapacağımız dosyayı seçerek “Create Favicon” butonuna tıklayalım. 2-3 saniye kadar sonra hazır olan favicon dosyalarını “Download the generated favicon” linkine tıklayarak indirelim. Artık üst kısımda bahsettiğimiz yöntemlerle sitemize favicon ekleyebiliriz.