Favicon Neden Gözükmüyor?

Merhaba iyi geceler arkadaşlar. Dün yeni bir temaya geçiş yaptım. Ancak sitemin faviconu admin panelindeyken tarayıcıda gözüküyor ama siteye giriş yaptığımda gözükmüyor. Farklı tarayıcılardan giriş yaptığımda da bazısında gözükürken bazısında gözükmüyor. Çok ilginç bi sorun cidden Faviconun gözükmesini sağlamak için ne yapabilirim? Yardımcı olursanız sevinirim. Site adı imzamda yer alıyor.

Sağ tık ve CTRL+U kapalı yardımcı olmak istemiyorum

<link rel="shortcut icon" href="/favicon.ico">

Bu kodu tam olarak nasıl kullanmam gerekiyor hocam acaba? Bu konularda biraz cahilim de

Arkadaşın paylaştığı kod head tagleri arasında gözükmeli. Bu konularda cahilim demişsin fakat internette buna dair sınırsız içerik var.

Teşekkür ederim hocam öncelikle. Bugün internette gezerken farklı sitelerde buna benzer kodlar görmüştüm evet ama hiç brinde head etiketi arasına ekleneceği yazmıyordu genel olarak bilindiği varsayılıyor sanırım. Benim gibi fazla bilgisi olmayanlar da bu konularda kodu yanlış yere eklemekten çekinebiliyor.

Aslında çoğu yerde yazıyor. Özet olarak temanızın header.php dosyasında head etiketleri arasına göstermek istediğiniz faviconu yerleştirebilirsiniz. Sadece favicon değil, ios cihazlarda favoriye ekleyince gözüken "app icon" dediğimiz uygulama gibi görünen site ikonunu vs meta kodu ekleyerek gösterebilirsiniz.




Şu sitede eklemek istediğiniz faviconu minimum 512px olarak yükleyip favicon oluşturursanız size dosya ve kod olarak veriyor direkt. https://www.favicon-generator.org/

örn:

<link rel="apple-touch-icon" sizes="57x57" href="/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192"  href="/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">

Doğru olabilir hocam dediğiniz ama bugün ziyaret ettiğim sitelerde denk gelmiş olsaydım kodu eklemeyi denerdim zaten. Tekrardan teşekkür ederim.

Kolayca oluşturmak için bir site paylaştım yorumumda. Faydalı olması dileğiyle. Yapamazsanız yazabilirsiniz.

Gördüm hocam. Çok teşekkür ederim. Şuan PC kapalı ama yarın direkt yapmayı deneyeceğim.