hur man lägger till bilder i WordPress 2022EN handledning för att lägga till bilder i klassiska och Gutenberg-redaktörer (+minska filstorleken)

idag bryter vi ner hur man lägger till bilder i WordPress och minskar deras Filstorlek (för att hålla dina sidor & inlägg laddas så snabbt som möjligt).

när du bara lär dig grunderna för hur du startar en blogg finns det mycket att räkna ut, jag förstår det. Vi har pratat om hur man ändrar teckenstorlek, ändrar teckensnittsfärg, gör en klickbar länk och så mycket mer här.

den goda nyheten är att 2022 är det väldigt enkelt att lära sig att lägga till bilder i WordPress med alla användbarhetsuppdateringar och förbättringar de har sett under det senaste decenniet.

i den här snabba handledningen visar jag dig hur du lägger till bilder i WordPress-inlägg, både i den klassiska redigeraren (som jag föredrar att använda) och genom deras nyare Gutenberg-redaktör.

låt oss nu dyka in i att lägga till bilder i dina WordPress—inlägg-samtidigt som du minskar deras Filstorlek så mycket som möjligt, för att hålla dig i linje med SEO-bästa praxis och för att hålla dina sidor laddade så snabbt som möjligt.

hur man lägger till bilder WordPress (och minska filstorleken) i 2022

1. lägga till bilder i inlägg i den klassiska WordPress-redigeraren
2. lägga till bilder i inlägg i Gutenberg WordPress-redigeraren
3. lägga till en utvald bild i ett inlägg i WordPress

nu snabbt, innan vi dyker in i den här handledningen om att lägga till bilder i WordPress, visar jag dig hur du minskar bildens filstorlek (hjälper dina inlägg att ladda snabbare) i 2 enkla steg.

installera (gratis) komprimera JPEG& PNG bilder Plugin av Tiny PNG

du kan ladda ner gratis komprimera JPEG & PNG bilder Plugin för WordPress här från WordPress plugin biblioteket.

Alternativt kan du också söka efter plugin och installera det direkt i din plugin-meny, tillgänglig på vänster sida av din bloggadministratörssektion här-eller kolla in den här snabba handledningen om hur du installerar ett WordPress-plugin:

när du har installerat komprimera JPEG & PNG bilder Plugin, varje ny bild du laddar upp till din WordPress blogg kommer automatiskt optimeras och filstorleken minskas så mycket som möjligt utan att kompromissa med kvaliteten på din bild.

Obs: Detta är den bästa bildkomprimering plugin på marknaden överlägset. Det tillåter upp till 500 gratis bildkompressioner per månad (vilket är mycket mer än du sannolikt behöver) innan du behöver uppgradera till en betald plan på $.009 / bild bortom din första 500 varje månad. Det är ett seriöst fynd och du hittar inte ett bättre komprimeringsplugin som ger dig fler Gratis Krediter.

men om du vill göra bildkomprimering direkt på din egen dator (obegränsat gratis), rekommenderar jag ImageOptim-applikationen.

Ladda upp dina bilder

det är det! Allvarligt är det så enkelt.

när du har installerat komprimeringsinsticksprogrammet på din blogg—eller har komprimerat enskilda bilder på din dator först—är du redo att ladda upp dem till dina inlägg eller sidor i WordPress.

nu, låt oss gräva i exakt hur man lägger till bilder till WordPress.

1. Lägga till bilder i inlägg i den klassiska WordPress-redigeraren

om du är som jag och fortfarande föredrar den klassiska WordPress-Redigeringslayouten för att lägga till/redigera dina inlägg, följ sedan här.

å andra sidan, om du använder den nyare Gutenberg-redigeraren för ditt inläggsinnehåll, hoppa sedan ner till nästa avsnitt för det genomgången. Om du inte är säker på vilken redaktör du använder, Ta en titt på bildskärmdumparna nedan och jämför dem med hur din redaktör ser ut. Vill du använda den klassiska redigeraren, men inte säker på hur du får den? Ta 2 minuter att följa med Yoasts enkla handledning om hur du installerar den klassiska redigeraren på din WordPress-blogg.

1. Öppna inlägget du lägger till bilder till (och hitta rätt plats)

först måste du se till att du är inne i inlägget du vill lägga till en bild till.

då vill du navigera markören till den exakta platsen i ditt inlägg som du vill lägga till bilden.

2. Klicka på knappen ”Lägg till Media” högst upp i din redaktör

den knappen kommer att se ut så här här:

när du klickar på knappen ”Lägg till Media” visas skärmen där du kan ladda upp din bildfil.

3. Klicka på”Ladda upp filer”

klicka på fliken för ”Ladda upp filer” och du kommer till skärmen där du kan använda väljarverktyget för att välja en bildfil där den finns på din dator.

alternativt, om du drar en bildfil från skrivbordet och laddar upp den—kan du hoppa över skärmen ”Ladda upp filer” och bara flytta direkt till att dra bilden in och släppa den (det finns en demo av detta i nästa steg).

4. Ladda upp din bildfil

jag föredrar att dra bildfiler från skrivbordet och släppa dem i filuppladdaren (istället för att använda väljaren för att hitta dem på min dator), eftersom det är mycket snabbare.

här är en snabb video / GIF-demonstration av hur du lägger till en bild från skrivbordet till WordPress:

när du har laddat upp din bild fungerar komprimeringsplugin det är magiskt för att minska filstorleken (bakom kulisserna).

notera: Innan du avslutar dina bildalternativ och klickar på ”Infoga i post”, Vill du skriva ut en SEO—vänlig Alt-Text för din bild-något som beskriver arten av vad som händer i din bild och helst vävning i ett av de målsökord du hoppas att artikeln så småningom kommer att rankas för (i organiska sökresultat).

5. Välj dina bildalternativ och klicka på ”Infoga i post”

Slutligen har du några alternativ att definiera för din bild. Detta inkluderar:

• kontrollera justeringen av hur din bild visas i ditt inlägg (jag väljer alltid Mittjustering)
• gör din bildlänk till en annan sida eller ett inlägg på din blogg (eller en extern länk som du vill rikta läsarna till)
• skärmstorlek (jag rekommenderar alltid att du laddar upp som full storlek för att undvika förlust av bildkvalitet)

när du har valt dessa alternativ är du redo att klicka på ”Infoga i post” och du är bra att gå!

den knappen kommer att vara här längst ner till höger på skärmen:

nu kommer du att tas tillbaka till ditt redigeringsfönster och du ser bilden du just lagt till sitter där där du laddade upp den.

Tänk på att du fortfarande har några snabba & enkla redigeringsalternativ om du bestämmer dig för att ändra något med visningen av din nya bild:

• du kan ändra storlek på den manuellt genom att ta tag i ett av hörnen och dra upp eller ner i storlek
• du kan klicka ner i mitten av bilden och dra den runt i ditt inlägg för att flytta den
• du kan alltid ta bort bilden genom att klicka på ”backspace” eller ”ta bort” på tangentbordet och börja om

och det är det! Du har lärt dig hur du lägger till en bild i WordPress med den klassiska redigeraren.

2. Lägga till bilder i inlägg i Gutenberg WordPress Editor

i Gutenberg WordPress Editor kommer dina redigeringsalternativ för inlägg att se mycket annorlunda ut än vad du ser från den klassiska redigeraren.

Gutenberg tar ett tillvägagångssätt för att lägga till/redigera innehåll genom ett system med ”block” som textblock, rubrikblock, bildblock och så vidare. Så låt oss dyka in i att lägga till bilder i Gutenberg.

1. Välj ikonen ”Lägg till bild”

när du har kontrollerat att du lägger till en bild på rätt plats i ditt inlägg väljer du ikonen ”Lägg till bild”. Det kommer att se ut så här här:

när du klickar på ikonen ”Lägg till bild” har du några alternativ för hur du kan lägga till en bild i ditt inlägg.

2. Välj hur du lägger till bilden

i Gutenberg har du några snabba alternativ för hur du lägger till en bild i WordPress. Det inkluderar:

• Ladda upp (som öppnar en väljarskärm som låter dig välja bildfilen från din dator)
• mediebibliotek (som tar dig till ditt befintliga bildbibliotek-från vilket du också kan dra & släpp i en bild)
• Infoga från URL (om det finns en bild som finns någonstans online som du vill importera kan du klistra in den länken här)

här är en ögonblicksbild av dessa alternativ (personligen klickar jag bara på ”Ladda upp” och tar snabbt den bild jag vill ha från mitt skrivbord):

3. Ladda upp din bild

när du har valt den bild du vill ladda upp klickar du bara på ”Öppna” – knappen så läggs den till i ditt inlägg.

nu när du har lagt till bilden visas en mindre miniatyrbild av den som ett nytt block i ditt inlägg.

här är en skärmdump av hur det kommer att se ut:

4. Bildinställningar & Snabbredigeringsalternativ

innan du går vidare vill du få dina bildinställningar uppringda (enligt SEO bästa praxis).

och precis som med den klassiska redigeraren kan du definiera många olika inställningar och egenskaper för en bild. Med Gutenberg är det bara gjort lite annorlunda. Dina bildinställningar finns istället över på höger sidofält (efter att du först klickat en gång på bilden).

så här ser dessa inställningar ut:

var noga med att definiera dina bildinställningar för åtminstone dessa två egenskaper:

• skriva SEO-vänlig alternativ text som beskriver bilden och väver i en sökordsfras
• Bildstorlek (jag visar alltid bilder som full storlek för att undvika kvalitetsförlust)

du kan också klicka på” Style ” – inställningarna för att lägga till lite mer nyanserad styling & inbyggda beskärningsfunktioner med Gutenberg.

5. Flytta bilder runt i ett inlägg via Gutenberg

en väldigt cool bieffekt av Gutenberg-redaktörens fokus kring att använda ”block” av innehåll är hur enkelt Du kan flytta dina bilder (eller innehållsblock för den delen) runt i ett inlägg.

när du har klickat en gång på bilden du vill ordna i ditt inlägg—ser du ”upp” och ”ner” pilar visas bredvid bilden.

klicka på pilarna för att flytta din bild uppåt eller nedåt inuti ditt inlägg, så:

och det är det! Du är klar.

du har nu lärt dig hur du lägger till en bild till WordPress i Gutenberg-redigeraren också. Lägga till en utvald bild i ett inlägg i WordPress

utvalda bilder är viktiga i en WordPress—blogg-eftersom de är bilderna som visas högst upp i dina blogginlägg (och i både sökresultat och på sociala medieplattformar när ditt innehåll delas).

sist men inte minst, så här lägger du till en utvald bild i ett inlägg (eller en sida) i WordPress.

längst ner till höger i ditt WordPress-redigeringsfönster ser du ett avsnitt för att lägga till en utvald bild. Klicka på” Set featured image ” så kommer du till standardbildöverföringsskärmen där du kan lägga till den bild du vill visas högst upp i ditt inlägg (även i sökresultat och på sociala plattformar).

när du har laddat upp bilden du vill använda och klickat på ”Ställ in utvald bild” kommer du att tas tillbaka till din redigeringsskärm och du ser en liten miniatyrbild av bilden som visas längst ner till höger (för att bekräfta att du har lagt till den högra bilden) så här:

ganska enkelt, eller hur?

om du valde fel bild (eller vill göra ändringar senare) kan du helt enkelt klicka på texten ”ta bort utvald bild” och du har möjlighet att välja eller ladda upp en annan bild som ska visas i ditt inlägg.

slutliga tankar om hur man lägger till en bild i WordPress

att lägga till bilder i dina inlägg i WordPress behöver inte vara svårt.

oavsett om du använder Classic Editor eller Gutenberg för din blogg har teamet bakom WordPress arbetat hårt för att göra att lägga till bilder till en mycket enkel process.

om du fortfarande har problem, snälla släpp mig en kommentar längst ner i det här inlägget och jag hjälper dig gärna att felsöka eventuella problem du har.

det är allt för idag!

vi täckte bara hur man lägger till bilder i WordPress exporten

gilla vad du ser? Registrera dig för att få fler blogging tutorials och råd.

Vill Du Ha Fler Blogging Tutorials?

gå över och kolla in min ultimata guide för att starta en blogg och tjäna pengar på det i år.