Teknisk Marknadsföring, Tjäna pengar på dina Bloggar och Prylar

Favicon visas inte – Fixa i Chrome, WordPress och Shopify

Favicon visas inte - Fixa i Chrome, WordPress och Shopify

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:
Läsa:  Hur du utökar dina TikTok-följare

  • “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.

Läsa:  WordPress säkerhetsplugins

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.

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.

Läsa:  Inbäddningsguide för WPBakery Page Builder (Wordpress)

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ä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:

Läsa:  Twitter Analytics: Varför du inte bör förbise denna aspekt av Twitter-marknadsföring

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.