Elementor-ikoner försvinner av förutsägbara skäl. Saknade CSS-filer, föråldrad plugin-data, cachningskonflikter, HTTPS-avvikelser och serverrestriktioner är de vanligaste orsakerna på WordPress-webbplatser i USA och globalt.
Den här guiden täcker alla orsaker och den exakta lösningen för var och en, så att du kan återställa dina ikoner utan gissningslek.
Elementor-ikoner kan misslyckas med att visas på grund av saknade ikonbibliotek, föråldrade plugin-filer, cachkonflikter, felaktiga filbehörigheter eller problem med inläsning av teckensnitt. Att lösa problemet innebär vanligtvis att återskapa Elementor-resurser, rensa cacheminnen, uppdatera plugin-program och verifiera att ikonteckensnittsfilerna laddas korrekt. Att kontrollera webbläsarens utvecklarverktyg kan också hjälpa till att identifiera blockerade resurser eller inläsningsfel som förhindrar att ikoner visas.
Vad är ikonrutan i Elementor?
Ikonrutan är en Elementor- widget som kombinerar en ikon, titel och beskrivning i ett enda element. Du använder den för att markera funktioner, tjänster eller viktig information på valfri sida. Den stöder Font Awesome, Material Design och anpassade ikonbibliotek, och du kan justera storlek, färg och placering direkt i Elementor-redigeraren utan att röra någon kod.
Här är vad du kan göra med ikonrutan:
- Välj din ikon: Oavsett om du gillar de från Font Awesome, Material Design eller om du har en unik ikon, är valet ditt.
- Gör den till din egen: Vill du ha ikonen lite större? En annan färg? Inga problem. Du kan justera dess storlek, ändra dess nyans och experimentera med dess utseende. Dessutom får du skriva din egen titel och beskrivning.
- Dra, släpp och klart: Du behöver inte vara tekniskt kunnig för att använda det. Dra bara ikonrute-widgeten till önskad plats på din sida eller i ditt inlägg, så är du klar.
Elementor-ikoner visas fortfarande inte? Få inte panik!
Vårt expertteam för WordPress-support kan hjälpa till att felsöka problemet. Kontakta oss idag.
Har du problem med ikoner i Elementor? Här är en checklista som kan hjälpa dig
Om dina ikoner inte syns, följ den här snabba checklistan för att identifiera det möjliga felet och återställa dem innan du försöker med mer avancerade lösningar.
- Uppdatera Elementor: Precis som när du uppdaterar dina telefonappar behöver programvaran ibland uppdateras. Se till att din Elementor är uppdaterad.
- Kontrollera ikonbiblioteket: Gå till Elementor, sedan Inställningar, sedan Avancerat och bekräfta att alternativet Font Awesome är aktiverat. Om det är avstängt kommer ikoner inte att visas oavsett andra inställningar.
- Testa för plugin- eller temakonflikter: Inaktivera tillfälligt dina andra plugins och byt till ett standardtema för WordPress, till exempel Twenty Twenty-Four. Om ikonerna dyker upp igen, återaktivera pluginsen en efter en för att identifiera konflikten.
- Rensa alla cachar: Rensa webbläsarens cache och cachen för cachelagrings-pluginet. Regenerera även Elementors filer under Elementor > Verktyg > Regenerera filer och data för att säkerställa att nya resurser laddas.
- Testa i en annan webbläsare: Vissa webbläsare hanterar teckensnittsinläsning på olika sätt. Testa din sida i Chrome, Firefox och Safari för att bekräfta om problemet är webbläsarspecifikt eller webbplatsövergripande.
- Kontrollera dina CDN-inställningar: Om du använder ett CDN kan det blockera teckensnittsfiler som Elementor-ikoner är beroende av. Inaktivera CDN tillfälligt och testa om ikoner laddas. Om de gör det, kontakta din CDN-leverantör för att vitlista de obligatoriska teckensnittsfiltyperna.
Tips för att åtgärda Elementor-ikoner som inte visas
Det kan vara förbryllande när Elementors anpassade ikoner väljer att leka kurragömma på din webbplats.
De flesta problem med Elementor-ikoner beror på en av två orsaker: nyligen genomförda ändringar i plugin-programmet som påverkar hur ikoner laddas, eller att ikoner saknas helt i biblioteket. Åtgärdarna nedan åtgärdar båda.
- Ändringar av Elementor-pluginet: Eventuella nya ändringar, uppdateringar eller anpassningar kan kräva att ikoner visas korrekt. Detta kan bero på konflikter eller inkompatibla inställningar.
- Ikoner saknas i biblioteket: Ibland kan biblioteksikoner saknas eller inte laddas, vilket gör att de försvinner från dina layouter.
Nu när vi har identifierat de troliga syndarna, låt oss gå igenom lösningarna för att få dina ikoner tillbaka i rampljuset.
Problem 1: Ändringar i Elementor-pluginet
Du kanske nyligen har uppdaterat eller precis installerat Elementor-pluginet, och nu visas inte alla Font Awesome-ikoner.
Här är vad du kan göra:
- Navigera till din WordPress-instrumentpanel.
- Välj ”Elementor” i sidofältet och välj sedan ”Inställningar”
- Klicka på fliken "Avancerat".
- Leta efter alternativet ”Ladda stöd för Font Awesome 4”. Aktivera det eller se till att det är aktiverat.
Problem 2: Föråldrade Elementor CSS och datafiler
Ibland misslyckas Elementor-ikoner med att laddas eftersom de genererade CSS-filerna blir föråldrade eller skadade efter en plugin-uppdatering eller konfigurationsändring. När detta händer kanske ikonernas teckensnitt inte laddas korrekt, vilket leder till att ikonerna visas tomma eller osynliga på sidan.
Som tur är erbjuder Elementor en snabb lösning på problemet. Följ dessa steg för att återskapa filerna:
- Gå till din WordPress-instrumentpanel och öppna Elementor.
- Klicka på Verktyg från menyn.
- Under Allmänt väljer du Återskapa filer och data.
- Klicka på knappen och låt Elementor uppdatera informationen.
Den här processen återskapar CSS-filerna som lagras i databasen och uppdaterar resurserna som används för att visa ikoner. När du har slutfört dessa steg, ladda om sidan och kontrollera om ikonerna nu är synliga.
I många fall löser denna enkla lösning felet utan att ytterligare felsökning krävs.
Problem 3: Problem med blandat innehåll eller HTTPS-konfiguration
En annan vanlig orsak till att ikoner inte visas är problem med blandat innehåll. Detta händer när din webbplats laddas via HTTPS, men vissa ikonfiler eller teckensnittsresurser fortfarande begärs via HTTP.
Moderna webbläsare blockerar dessa förfrågningar av säkerhetsskäl, vilket förhindrar att ikonerna laddas.
Börja med att kontrollera WordPress-adressen och webbplatsadressen i dina allmänna inställningar för att säkerställa att båda använder rätt https-URL. Om det inte finns någon matchning, uppdatera inställningarna och spara ändringarna.
Du kan också granska sidan i webbläsarens utvecklarverktyg för att hitta blockerade resurser. Om ikonfiler blockeras, uppdatera webbadresserna i din databas eller plugin-inställningar.
När alla resurser har laddats via HTTPS bör ikonerna bli synliga igen.
Problem 4: Problem med filbehörighet eller serverkonfiguration
I vissa situationer kan problemet bero på ditt webbhotell eller din serverkonfiguration. Elementor-ikoner använder typsnittsfiler som WOFF och TTF. Om servern blockerar dessa filtyper eller om filbehörigheterna är felaktiga kanske ikonerna inte laddas korrekt.
För att lösa detta, kontrollera filbehörigheterna i din WordPress-installation, särskilt i mappar som lagrar Elementor-resurser. Behörigheterna bör ge servern åtkomst till dessa filer.
Du kan också kontakta din webbhotellsleverantör för att bekräfta att typsnittsfilerna inte är begränsade av säkerhetsregler. Vissa servrar blockerar vissa resurser som standard, vilket kan göra att ikoner visas tomma.
När servern tillåter åtkomst till de nödvändiga filerna bör Elementor-ikoner laddas normalt över din webbplats meny och sidor.
Problem 5: Ikoner försvinner från biblioteket
Ibland försvinner ikoner i Elementors ikonbibliotek, särskilt i mallar som använder "Nucleo Mini"-ikoner.
Så här kan du kontrollera och lösa detta:
- Besök sidan där dina ikoner ska visas.
- Klicka på knappen ”Redigera med Elementor” för att starta Elementor-redigeraren.
- Därifrån öppnar du mediebiblioteket. Detta låter dig se om ikonen du letar efter finns i biblioteket.
- Om den önskade ikonen saknas bör du uppdatera ditt Kava Extra-plugin till den senaste versionen för att lösa problemet.
Alternativ till Font Awesome-pluginet
Om ovanstående lösningar inte återställer dina ikoner kan du prova en annan metod: installera Font Awesome -pluginet direkt.
- I din WordPress-administratörspanel, navigera till Plugins → Lägg till nytt → Ladda upp plugin.
- Här har du ett alternativ att ladda upp Font Awesome-pluginet som du har laddat ner till din dator.
- Klicka på knappen “Installera nu”.
- När du har installerat det, glöm inte att klicka på knappen "Aktivera plugin".
- Pluginet Font Awesome borde nu vara aktiverat på din webbplats och dina ikoner borde fungera igen.
Säkerhetskopiera alltid din webbplats innan du gör några större ändringar eller uppdateringar. Om något oväntat händer har du ett skyddsnät att falla tillbaka på.
Slutsats: Åtgärda Elementor-ikoner och håll dem igång
Saknade Elementor-ikoner beror nästan alltid på en av fem orsaker: föråldrade plugin-inställningar, inaktuella CSS-filer, HTTPS-konflikter, serverbegränsningar eller saknade biblioteksikoner.
Genomför lösningarna i ordning, så löser du problemet i de flesta fall utan att kontakta supporten. Om allt annat misslyckas, ger installationen av Font Awesome-pluginet en pålitlig reservlösning som fungerar oberoende av Elementors inbyggda ikoninläsning.
Vanliga frågor om att åtgärda Elementor-ikoner som inte visas
Varför syns inte Elementor-ikoner på min WordPress-webbplats?
Elementor-ikoner kanske inte visas på grund av cachproblem, felaktig WordPress- eller webbplatsadress, eller kompatibilitetsproblem med plugin- eller tilläggsprogram. Ibland kan teckensnittsfamiljen för ikoner inte laddas på grund av fel URL, blockerade HTTPS-resurser eller föråldrade databasfiler. Om detta händer för första gången, rensa cachen och följ stegen ovan i den här handledningen för att återställa ikoner och göra dem synliga igen.
Hur kan jag åtgärda Elementor-ikoner som inte visas efter inloggning?
När du har loggat in på din WordPress-instrumentpanel öppnar du Elementor-inställningarna och genererar CSS-filerna. Den här åtgärden uppdaterar lagrad data och åtgärdar många ikoninläsningsfel. Du kan också rensa webbplatsens cache från din webbhotellspanel eller cache-plugin. I många fall löser dessa två sätt problemet snabbt.
Kan ett cachningsproblem göra att Elementor-ikoner visas tomma?
Ja. Ett cachningsproblem förhindrar ofta att nya ikonfiler laddas. När cachade filer förblir föråldrade kan ikoner visas tomma eller saknas. Rensa din webbläsares, plugin- och CDN-cacheminne. När den gamla informationen uppdateras bör ikonerna synas igen.
Påverkar plugin- eller tilläggskonflikter Elementor-ikoner?
Ja. Vissa Elementor-tillägg eller tredjepartsplugins kan orsaka kompatibilitetsproblem som hindrar ikoner från att laddas. Inaktivera plugins ett efter ett från menyn för att hitta konflikten. När det problematiska pluginet har identifierats, uppdatera eller ersätt det.
Vad ska jag kontrollera om felet fortfarande kvarstår?
Om felet kvarstår efter att du har följt stegen ovan, kontrollera WordPress-adressen och webbplatsens adressinställningar, bekräfta korrekt HTTPS-konfiguration och granska databasdata.
