K. Andersson
Vad är en favicon
Favoriter gör det lättare för användare att känna igen din webbplats när de har flera flikar öppna i en webbläsare. Favoriter visas vanligtvis precis före webbadressen i webbläsaren. Du kan också se favoritikoner i bokmärken, Googles autoslutföranderesultat och sökhistorik. Här är platser där favoriter kan visas i olika webbläsare.
Favoriter kan definieras som ikoner som används som en del av webbplatsens varumärke. En favicon kan vara en varumärkeslogotyp, en karaktär eller uppsättning tecken, en del av en logotyp eller till och med en generisk bild som representerar företaget eller branschen där varumärket verkar.
I den här artikeln kommer vi att undersöka varför favoritikoner inte visas och hur du åtgärdar dessa problem.
Hur man installerar favicons korrekt
Du måste installera faviconen korrekt om du vill att den ska återges korrekt. Skapa först en favoritikon. Det är många favicon generatorer som du kan använda för detta. Lägg sedan till den på din webbplats. Så här installerar du det på huvudsidorna på din webbplats:
- Ladda upp filen favicon.ico till en valfri katalog på din webbplats.
- Lägg till den här koden -sektion:
- “bilder” måste ersättas med katalogen där dina favoritbilder är lagrade.
- “favicon.ico” måste ersättas med vad du än har döpt till din ikon.
- Observera att rel-värdet också kan vara “ikon”, “apple-touch-icon” eller “apple-touch-icon-precomposed”
- href-värdet kan vara en relativ sökväg (där du använder filsökvägen där faviconen är lagrad) eller en absolut URL (där du använder din domän och lägger till faviconen till URL:en på https://abc.com/favicon .ico )
Mer information om hur du lägger till favoritikoner finns i den här artikeln. Du kan också läsa om det Googles instruktioner för favoriter här.
Vanliga orsaker till att Favicon inte visas
Du kan kontrollera om din favoritbild visas korrekt genom att använda kontrollverktyget på vår hemsida. Här är vanliga orsaker till att ditt favoritfoto inte visas och hur du åtgärdar problemen:
Syntaxfel
Ett enkelt syntaxfel i koden du använder för att aktivera favoritikoner kan leda till att din favoritbild inte dyker upp. Här är ett exempel:
Det finns ett enkelt syntaxfel i koden ovan:
- Href-länken saknar citattecken
Din webbläsare har cachat din webbplats som en utan en favoritikon
När du lägger till en favoritikon på din webbplats kanske den inte visas eftersom din webbläsare har “sparat” din webbplats som en som inte har en favoritikon. Du måste rensa webbläsarens cacheminne eller använda en annan webbläsare.
Alternativt kan du lägga till /favicon.ico till din domän som på www.abc.com/favicon.ico
Fel sökväg
Du måste se till att sökvägen till favicon-filen är korrekt. Om du har din ikon i din bildmapp, se till att din filsökväg har /images/favicon.ico baserat på vad du kallade din ikon.
Om din CSS och ikon är syskon för att de är “på samma nivå”, se till att favicon-filnamnet inte har ett snedstreck framför sig, eftersom din href-text ska vara:
href=”favicon.ico”
Webbläsaren visar inte favoritikoner om de är lokala
Webbläsare som Chrome och Safari visar inte favoritikoner om de är lokala (inte laddade upp till servern). Till exempel kan Chrome bara visa en favoritikon om den finns i nedladdningsmappen.
Länken för att skapa en favoritikon är inte på rätt plats
Det är viktigt att placera länken för att lägga till din favoritbild på rätt plats. Den måste placeras i rubriken på din webbsida, inte någon annanstans. Även om det kan fungera i vissa webbläsare när det placeras i en textbröd, kommer andra webbläsare som Chrome inte att ladda det.
Favicon-filnamnet är fortfarande standardfilnamnet
Ibland är anledningen till att din favoritbild inte visas för att filnamnet inte har ändrats. En enkel fix för detta är att byta namn på favicon-filen från standard “favicon.ico”.
Låt oss nu fokusera på varför favoritikoner inte visas i Chrome, WordPress, Shopify, Wix och Squarespace:
Anledningar till varför Favicon inte visas i Chrome speciellt
Här är anledningarna till att din favoritbild kanske inte visas i Chrome:
Faviconstorleken är felaktig
Vi nämnde att Google har specifika instruktioner att följa när du lägger till favoriter på din webbplats. En av dem är att ikonstorleken måste vara en multipel av 48 och får inte vara 16×16. Om ikonstorleken är 16×16 kommer den inte att visas.
Innehållshanteringssystem (CMS) har också vissa rekommenderade storlekar. WordPress rekommenderar 512 x 512 och Squarespace 300 x 300. Dessa innehållshanteringssystem kan ändra storlek på favoritikonen för att passa olika scenarier. Till exempel behövs en större storlek för bokmärken, medan en mindre storlek kan behövas för mobila enheter.
Den här artikeln tittar på olika favicon-storlekar, vad de fungerar bäst för och till och med utfasade storlekar.
Favicon-filen finns i rotkatalogen, men dess “import”-länk läggs inte till
Bara för att favicon-filen finns i din rotkatalog betyder det inte att den automatiskt laddas när din webbplats laddas. Se till att din rubrik innehåller dessa länkar:
Dessa kommer att ge en favoritikon till din webbplats.
Orsaker till varför Favicon inte visas specifikt i Shopify
Här är anledningarna till att din favoritbild kanske inte visas på Shopify:
Länken för att importera favicon är på fel plats
Länkplacering är viktigt. Se till att det är det
– avsnitt, nr– sektion.
Se hur du skapar en favoritikon för din Shopify onlinebutik
Anledningar till varför Favicon inte visas specifikt i WordPress
Här är anledningarna till att din favoritbild kanske inte visas i WordPress:
I Customizer är webbplatsikonen för AMP-faviconen
Om du använder en anpassad favoritikon kanske den inte fungerar eftersom den är avsedd för sidor som använder AMP. För att åtgärda det här problemet, ta först bort favoritikonen som du laddade upp med anpassaren. Du måste sedan installera ett plugin som heter ‘Favicon av RealFvicon Generator‘. Detta plugin låter dig ladda upp bilden du vill använda som din favoritikon. Det måste vara i png- eller jpg-format. Tillägget hjälper dig att konvertera det till .ico-format.
Ditt huvud/huvud kan ha en förlängning som lägger till kroppselement
Du måste se till att du inte har ett plugin som skapar kroppselement
– sektion. Gå igenom huvudsektionen och om du ser kod som hör hemma i kroppssektionen, kontrollera pluginsen du installerade när du la till faviconen på din WordPress-webbplats. Fortsätt och inaktivera det eller till och med ta bort det.Du har inte angett en bildtyp om det inte är .ico
Om din ikon är i .png-format måste du redigera länken du använder för att ladda ner faviconen så att den inkluderar typen enligt följande:
Du måste också lägga till .ico-filen i webbplatsroten.
Lär dig hur du lägger till en favoritikon på en WordPress-webbplats.
Anledningar till varför Favicon inte visas i Squarespace specifikt
Här är anledningarna till varför din favoritbild kanske inte visas på Squarespace:
Den cachade versionen har inte ogiltigförklarats ännu
-sektionsmallkoden använder alltid “favicon.ico” som filnamn. Detta är en cachad version. Om du vill ogiltigförklara den, ändra filnamnet.Du är fortfarande inloggad på CMS
Om du fortfarande är inloggad på ditt innehållshanteringssystem kan det fortfarande visas standardikonen för Squarespace. Du måste logga ut från CMS för att se din anpassade favoritbild.
Slutsats
Favoriter är användbara för att hjälpa till med varumärkeskonsistens. De gör din sajt lätt att känna igen om användaren behöver identifiera flera sajter på en gång, till exempel när flera flikar är öppna. De är bra för återkommande besökare och kunder. När en användare bokmärker din webbplats gör favoritikoner den lätt att känna igen.
Att distribuera favoritikoner kanske inte alltid är enkelt, och vi har tittat på vanliga orsaker till att favoritikoner inte visas. Vi har till och med undersökt problem som kan uppstå när du använder vissa innehållshanteringssystem – innehållshanteringssystem som WordPress, Shopify eller SquareSpace. Som du kanske har märkt är de flesta problem enkla nog och du kan fixa dem. Tveka dock inte att be om professionell hjälp vid behov.
