När du laddar upp en bild i WordPress så skapas flera bildstorlekar av din bild direkt och sparas i din mapp för uppladdade bilder på webbservern. På så sätt så finns bilderna tillgängliga när de behövs på olika delar av webbplatsen.

De bildstorlekar som finns i WordPress vanligtvis är

  • Thumbnail (miniatyr), oftast 150 x 150 pixlar, beskärs
  • Medium, oftast 300 x 300 pixar
  • Large, oftast 1024 x 1024 pixlar
  • Full, den storleken som bilden har när du laddar upp den

Förutom de storlekarna så kan ditt tema ha lagt till fler storlekar, eventuella bildspel eller andra tillägg kan också ha lagt till bildstorlekar.

Bildstorlekar i WordPress i praktiken

Vad innebär det här för mig som redaktör i WordPress när jag ska ladda upp en bild då? Jo, låt oss säga att du har en bild på 200 x 150 som du laddar upp, då finns det två varianter av den bilden. En som är i den storlek du laddade upp och en beskuren bild på 150 x 150.

Den första bilden är den bild jag laddade upp och den andra bilden är den beskurna varianten som skapas automatiskt. I det här fallet finns inte de andra storlekarna (medium och large) eftersom bilden är för liten.

obeskuren bild
Obeskuren bild, full storlek
beskuren bild
Beskuren bild till miniatyr

 

 

 

 

 

Ett annat exempel

Här har jag laddat upp en bild som redan från början är fyrkantig och då skapas en miniatyr men den beskärs inte.

Full storlek
Full storlek, 426px
Miniatyr 150px
Den skapade miniatyren

Varför skapas flera bildstorlekar och beskärs bilder?

Bilderna beskärs i WordPress för att kunna kontrollera layouter. Oftast används miniatyren (thumbnail) på sidor som hämtar information från många olika inlägg. Om man på en sådan sida skulle visa bilderna så som de har laddats upp så skulle layouten förmodligen bli mycket rörig. Vi har ju laddat upp våra bilder i många olika storlekar och blandat porträtt- och landskapsformat.

En annan sak är att många laddar upp bilder i stort sett direkt från sin digitalkamera/mobil och dessa bilder är ofta jättestora. Kanske omkring 2000 x 3000 px. Om då bara en bild på 150px ska visas så blir det ineffektivt att skicka ut en så stor bild till besökarnas dator/mobil. Det tar resurser och slöar ner din hemsida. Google tycker också att man är en klant i analyser av sidan.

Om en bild ska användas som miniatyr så är det bästa att du laddar upp den i rätt storlek

Hur ser jag vilka bildstorlekar som används?

Du kan se vilka bildstorlekar som är inställda i ditt tema om du i WordPress-panelen går till Inställningar => Media

Media inställningar i WordPress
Media inställningar i WordPress

 

OBS! Om du ändrar inställningar här så kommer det att påverka framtida bilder, men inte de bilder du redan har laddat upp!

Om du vill veta vilken bildstorlek som används till exempel i ett bildspel så får du titta i inställningarna för det tillägget.

Andra problem med beskurna bilder

Som jag skrev innan så kan ditt tema ha satt upp bildstorlekar eller ett tillägg. Jag skrev också att bildstorlekarna skapas när du laddar upp en bild. Det här ledar till problem (kanske) om du byter tema eller tillägg, eller ändrar bildstorlekar.

Tänk dig följande scenario: Du har ett tema som använder miniatyrer på 150x150px och du har laddat upp bilder i flera år. Inga problem och allt fungerar finfint. Men nu byter du tema och det nya temat använder 200x150px som miniatyr.

Det är fortfarande inga problem utan allt ser bra ut. Eftersom inte den nya miniatyr-storken finns så använder din hemsida de tidigare skapade miniatyrena på 150x150px. Men nu laddar du upp en ny bild och då skapas en miniatyr på 200x150px för just den posten. Det kan se lite konstigt ut!

Det finns ett tillägg som kan lösa det här problem och skapa alla nya bildstorlekar du behöver om du byter tema https://wordpress.org/plugins/regenerate-thumbnails/.

Läs lite mer om bilder på Checklista när du laddar upp bilder till din hemsida

Karin H Olsson

Jag har en bakgrund som konstruktör inom realtidssystem, de system som finns inbyggda i bilar, flygplan mm. Sedan tio år är jag företagare. Utbildad systemvetare och beteendevetare och mitt intresseområde finns där människor och datorer möts. En dag förstår vi varandra ;)

Det är alltid roligt när någon har synpunkter och feedback.
Så kommentera gärna!

Stäng meny