Våra läsare frågar oss ofta om det är möjligt att visa ikoner för bilagda filer i WordPress. Att lägga till filikoner kan hjälpa användare att snabbt identifiera vilken typ av fil de laddar ner.
Att använda ikoner för bilagda filer är ett enkelt sätt att göra din webbplats mer användarvänlig. Det lägger till visuella ledtrådar som hjälper besökare att bättre förstå ditt innehåll.
På WPBeginner har vi använt olika ikoner på vår webbplats för att förbättra användarupplevelsen. Från ikoner för sociala medier till filbilagor, ikoner gör navigeringen tydligare och mer intuitiv.
I den här guiden visar vi hur du enkelt lägger till ikoner för bifogade filer i WordPress. Med våra steg kan du visa filikoner som matchar typen av filer på din webbplats.
När du behöver ikoner för bifogade filer i WordPress
Som standard tillåter WordPress dig att ladda upp bilder, ljud, video och andra dokument. Du kan också aktivera ytterligare filtyper som kan laddas upp i WordPress.
När du laddar upp en fil via medieuppladdaren och lägger till den i ett inlägg eller en sida, kommer WordPress att försöka bädda in filen som om det vore en bild, ljud, video eller i ett filformat som stöds.
För alla andra filer lägger den bara till ett filnamn som vanlig text och länkar det till nedladdnings- eller bifogningssidan.
I skärmdumpen ovan har vi lagt till en PDF- och en Docx-fil. Det är dock svårt för en användare att gissa vilken typ av fil de skulle ladda ner.
Om du regelbundet laddar upp olika filtyper, kanske du vill visa en ikon bredvid länken. På så sätt kan dina användare enkelt hitta den filtyp de letar efter.
Med det sagt, låt oss se hur man lägger till ikoner för bifogade filer i WordPress för olika filtyper.
Metod 1: Lägg till ikoner för bifogade filer i WordPress med hjälp av ett plugin
Det enklaste sättet att lägga till ikoner för filtyper är att använda ett WordPress-plugin som MimeTypes Link Icons. Det är ett gratis plugin som är mycket lätt att använda och låter dig lägga till ikoner för olika filtyper.
Det första du behöver göra är att installera och aktivera pluginet MimeTypes Link Icons. För mer information, se vår steg-för-steg-guide om hur man installerar ett WordPress-plugin.
ℹ️Obs: Pluginets nedladdningssida kan visa att det inte har testats eller uppdaterats på ett tag. Vi testade det på våra demosidor och fann att det fungerade som avsett. Läs vår artikel om att installera plugins som inte har testats med din WordPress-version.
Efter aktivering måste du besöka sidan Inställningar » MimeType Icons för att konfigurera pluginets inställningar.
Pluginet låter dig välja ikonstorlek, samt mellan PNG- och GIF-ikoner. Därefter behöver du välja ikonjustering och vilka filtyper som ska visa ikonen.
Därefter kan du skrolla ner och välja ikoner att visa på din webbplats. Till exempel finns det ikoner för filtyper som PDF, PPT, CSV, AVI, RPM, TXT och mer.
Därefter kan du skrolla ner till avsnittet Avancerade inställningar.
Här hittar du alternativet för att visa filstorlek bredvid nedladdningslänken. Det är avstängt som standard, eftersom det kan vara resurskrävande.
När du är klar, kom ihåg att klicka på knappen ‘Spara ändringar’ för att spara dina inställningar.
Du kan nu redigera ett inlägg eller en sida och lägga till en filnedladdningslänk med hjälp av medieuppladdaren. Förhandsgranska bara ditt inlägg så ser du filikonen bredvid nedladdningslänken.
Metod 2: Använda ikon-typsnitt för bifogade filer i WordPress
I den här metoden kommer vi att använda ett ikon-typsnitt för att visa en ikon bredvid länken till den bifogade filen.
Det första du behöver göra är att installera och aktivera pluginet Font Awesome. Om du behöver hjälp, se vår guide om hur man installerar ett WordPress-plugin.
Efter aktivering kan du gå till sidan Inställningar » Font Awesome från din WordPress-instrumentpanel. Här kan du redigera de allmänna inställningarna för pluginet, som att välja om det ska använda pro- eller gratisikoner.
Därefter kan du redigera ett inlägg eller en sida där du vill lägga till en bifogad länk.
När du är i innehållsredigeraren måste du ange HTML-koden för ikonen du vill visa.
För att hitta den HTML-koden kan du besöka Font Awesome ikonbibliotek. Sök helt enkelt efter en ikon i sökfältet och klicka sedan på bilden.
Därefter ser du olika varianter av ikonen och dess HTML-kod.
Klicka på koden för att kopiera den.
Därefter kan du återgå till din webbplats WordPress-innehållsredigerare och klicka på '+'-tecknet för att lägga till ett anpassat HTML-block.
Härifrån klistrar du helt enkelt in koden för din ikon i blocket.
När du är klar, fortsätt och publicera eller uppdatera din sida.
Du kan nu besöka din webbplats för att se den nyligen tillagda ikonen för bifogade filtyper.
Bonus: Sälj digitala filer för att tjäna pengar online
Nu när du vet hur du lägger till ikoner för bifogade filtyper, kan du gå ett steg längre och sälja olika filer som digitala nedladdningar. Detta gör att du kan tjäna pengar online eller uppmuntra användare att registrera sig för ditt nyhetsbrev i utbyte mot en gratis resurs.
Det bästa sättet att sälja digitala produkter är att använda Easy Digital Downloads. Det är en av de bästa e-handelsplattformarna för WordPress, och den är mycket enkel att använda och konfigurera.
Vi använder det för några av våra företag. Du kan läsa mer om det i vår kompletta Easy Digital Downloads recension.
Easy Digital Downloads integreras enkelt med olika betaltjänster som PayPal och Stripe.
Dessutom kan du helt enkelt ladda upp digitala filer som du vill sälja och börja tjäna pengar online.
Pluginet låter dig lägga till detaljer som en titel och beskrivning, ställa in priset för nedladdningen, välja en nedladdningsbild och mer.
För mer information, se vår guide om hur man säljer digitala nedladdningar i WordPress.
Bonusresurser:
Följande är några ytterligare användbara resurser som du kan finna hjälpsamma för att hantera din WordPress-webbplats och media:
- Hur man använder WordPress för dokumenthantering eller filhantering
- Hur du hittar dina sparade utkast i WordPress (nybörjarguide)
- Hur man laddar upp PDF-filer till din WordPress-webbplats
- Hur man kopplar ihop flera WordPress-webbplatser (3 sätt)
Vi hoppas att den här artikeln hjälpte dig att lära dig hur du lägger till ikoner för bifogade filer i WordPress. Du kanske också vill se vår guide om hur du bäddar in PDF-filer, kalkylblad och andra filer i WordPress-blogginlägg och vårt experttips om de bästa pluginen för aktivitetsloggning och spårning i WordPress.
Om du gillade den här artikeln, prenumerera då på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.
Mrteesurez
Den här handledningen är hjälpsam! Att lägga till filtypsikoner förbättrar verkligen användarupplevelsen, vilket gör det lättare för besökare att identifiera bilagor när de är på väg att ladda ner dem.
Jag har gjort detta på min webbplats, och det fick omedelbart mitt innehåll att se mer professionellt ut. Din steg-för-steg-guide gör processen så enkel. Jag vill fråga hur påverkar tillägget av ikoner min webbplats laddningstid?
WPBeginner Support
Det bör inte ha någon större effekt på din webbplats hastighet.
Admin
Mrteesurez
Tack för svaret. Jag frågade eftersom användning av ikoner ofta kräver nedladdning eller laddning av fontbibliotek som Font Awesome eller Google Fonts, vilket kan påverka en webbplats hastighet. Jag uppskattar att du låter mig veta att det inte har någon större effekt på min webbplats hastighet.
Isha Singh
Jag är inte bekant med WordPress. Men medan jag går igenom ditt inlägg, verkar det som att jag vet allt om WordPress.
Enc
Rekommenderar du på allvar ett plugin som inte har uppdaterats på ett år?
WPBeginner Support
Ja, det är vi. Se vår artikel ska du installera plugins som inte har testats med din WordPress-version för mer om detta ämne.
Admin