Hoppa till innehåll
Observera: Översättningen av denna artikel är endast avsedd att underlätta för dig. Översättningen har skapats automatiskt med hjälp av en översättningsprogramvara och har eventuellt inte korrekturlästs. Den engelska versionen av denna artikel bör därför betraktas som den gällande versionen med den senaste informationen. Du kan komma åt den här.

Använd bilder i HubSpot-innehåll

Senast uppdaterad: 30 oktober 2026

Tillgänglig med något av följande abonnemang, om inte annat anges:

Lägg till bilder i rich text-moduler eller bildmoduler i HubSpot-innehåll. Rich text-moduler stöder flera olika typer av innehåll (bilder, text, CTA:er osv.), medan varje bildmodul endast kan innehålla en enda bild.

Lägg till bilder i innehåll

Behörigheter krävs Redigeringsbehörighet för filer krävs för att ladda upp en ny bild.

Observera: endast bildfiler i formaten .png, .ico, .bmp, .jpg och .gif kan läggas till i marknadsföringsmejl.

  • Så här lägger du till en bild på en sida, i ett inlägg eller i en artikel: 
    • Rich text-modul:Klicka på rich text-modulen och sedan påikonen insertImageiciimage iverktygsfältet för rich text.
    • Bildmodul:Klicka påbildmodulen och sedan på Ersätt isidopanelen ovanför platshållarbilden. 
  • Välj en bild: 
    • För att infoga en befintlig bild, klicka på bilden i den högra panelen.
    • För att ladda upp en ny bild från din dator eller via en fil-URL, klicka på Lägg till bild i den högra panelen. För att skapa en ny bild med Canvas redigeringsverktyg, klicka på Designa med Canva. Klicka sedan på bilden för att infoga den.
  • Innan du infogar en bild kan du optimera den för laddningstid eller upplösning. I den högra panelen håller du muspekaren över bilden och klickar på Detaljer.
  • Klicka sedan pårullgardinsmenyn Bildoptimeringoch välj ettoptimeringsalternativ: 
    • Hög: bilden laddas med högre upplösning, men med längre laddningstid.
    • Standard: bilden optimeras för både upplösning och laddningstid.
    • Låg: bilden laddas med lägre upplösning, men med kortare laddningstid. Läs mer om hur du optimerar sidor för laddningstid i vår utvecklardokumentation. 
       
KB - Image Optimization

Redigera bilder

När du har lagt till en bild i ditt innehåll kan du redigera dess storlek, lägga till alt-text, lägga till en länk eller ställa in hur den ska laddas.

Redigera en bild i en rich text-modul 

  • Gå till ditt innehåll:

  • Klicka på namnet på ditt innehåll. 
  • I innehållsredigeraren klickar du på bilden för att visa verktygsfältet för bildredigering.
  • Redigera bilden: 
    • För att justera hur texten flödar runt bilden klickar du på ikonerna för justering av textplacering. 
    • För att justera bildens storlek klickar du på bredd- och höjdpilarna eller anger ett värde i pixlar. 
    • För att justera avståndet runt bilden klickar du på rullgardinsmenyn Avstånd och anger sedan pixelvärden runt bildens kanter.
  • För att ta bort en bild från en rich text-modul, klicka på bilden och sedan påpapperskorgsikonen. 
  • För att ersätta en bild i en rich text-modul, klicka på bilden och sedan påikonen ”Ersätt” och lägg till en ny bild.
edit-image-in-rich-text-module
  • För att länka bilden, lägga till alternativtext eller ställa in laddningsbeteendet, klicka på bilden och sedan på pennikonen för redigering:
    • För att lägga till en länk till bilden klickar dupå rullgardinsmenyn Länk tilli popup-rutan och väljer en länkkategori. I fältet nedan anger du länkensmål. Läs mer om de olika typerna av länkar.
    • I fältet ”Alternativtext” anger dutext som beskriver för sökmotorer och skärmläsare vad bilden föreställer. Du kan också lägga till alternativtext till bilder i filverktyget. Att lägga tillalternativtext förbättrar tillgängligheten och SEO för din webbplats. Läs mer om webbtillgänglighet i vår utvecklardokumentation. 

Observera: att lägga till alt-text till en bild innebär inte att titeltext läggs till. Alt-text påverkar sökmotorrankningen och tillgängligheten, medan titeltexten visas när en besökare håller muspekaren över bilden. 

  • För att ställa in bildens laddningsbeteende och anpassa bildlänktypen för sökmotorer klickar du på Avancerat. 
    • För att ställa in hur bilder ska laddas klickar du pårullgardinsmenyn Bildladdning och väljer ett alternativ: 
      • Lazy: bildenladdas först när besökaren når den delen av sidan. Detta minskar sidans laddningstid och förbättrar SEO. Som standard laddas bilder med denna inställning. 
      • Webbläsarens standardinställning: Bildens laddningsbeteendebestäms av besökarens webbläsarinställningar. 
      • Eager: bildenladdas så snart sidan laddas. 
    • För att anpassa bildlänktypen väljer du ett eller fleraattribut i avsnittet Länktyp: 
      • Vanlig: den härlänken är inte sponsrad. 
      • No follow:Denna länk är inte kopplad till din webbplats.
      • Sponsrad: den härlänken är en sponsrad länk eller en annons.
      • Användargenererat innehåll: den härlänken leder till användargenererat innehåll, till exempel en bloggkommentar eller en forumdiskussion. 
  • Klicka på”Apply” för att tillämpa dina ändringar på bilden.

add-link-and-alt-text-to-rich-text-image

  • För att publicera dina ändringar klickar dupå”Publicera” eller”Uppdatera”längst upp till höger och sedan på ”Publicera” eller”Uppdatera” idialogrutan. 

Redigera en bild i en bildmodul

  • Navigera till ditt innehåll:

  • Klicka på namnet på ditt innehåll. 
  • I innehållsredigeraren klickar du på bildmodulen. 
  • För att ta bort den aktuella bilden klickar du på Ta borti avsnittet Bild i sidopanelen. Detta tar bort den aktuella bilden från bildmodulen, men tar inte bort modulen från sidan. 
  • För att ersätta den aktuella bilden klickar du påErsätt i avsnittet Bild i sidopanelen och lägger sedan till en ny bild. 
  • I fältet Alt-text anger dutext som beskriver för sökmotorer och skärmläsare vad bilden föreställer. Du kan också lägga till alt-text till bilder i filverktyget. Att lägga tillalt-text förbättrar tillgängligheten och SEO för din webbplats. Läs mer om webbtillgänglighet i vår utvecklardokumentation. 

Observera: att lägga till alt-text till en bild innebär inte att titeltext läggs till. Alt-text påverkar sökmotorrankningen och tillgängligheten, medan titeltexten visas när en besökare håller muspekaren över bilden. 

replace-image

 


  • För att ställa in bildens storlek på olika enheter klickar du på rullgardinsmenyn Storlek och väljer ettalternativ:
    • Justera automatiskt:bilden skalas så att den passar den enhet den visas på. 
    • Exakt höjd och bredd: bilden visas i samma storlek på alla enheter.
  • För att ställa in en gräns för bildens storlek, klicka på rullgardinsmenyn ”Maximal storlek” och välj ettalternativ under ” ”: 
    • Bildens ursprungliga storlek: bilden visas aldrig större än sin ursprungliga storlek. 
    • Anpassad: bilden kommer aldrig att visas större än den specifika bredd och höjd som anges i fälten förbredd ochhöjd. 
  • För att ställa in hur bilden ska laddas, klicka pårullgardinsmenyn Bildladdning och välj ett alternativ: 
    • Webbläsarens standard: Bildens laddningsbeteende bestäms av besökarens webbläsarinställningar. 
    • Lazy: bildenladdas först när besökaren når den delen av sidan. Detta minskar sidans laddningstid och förbättrar SEO. Som standard laddas bilder med denna inställning. 
    • Eager: bilden laddas så snart som möjligt. 
  • För att lägga till en länk till bilden anger du enmål-URL ifältetLänk (valfritt). Markera kryssrutan Öppna länken i en ny flikför att leda besökaren till mål-URL:en i en ny flik i webbläsaren.
  • För att publicera dina ändringar klickar dupåPublicera ellerUppdateralängst upp till höger.
     

set-image-size-and-loading-options

 

Hjälpte artikeln?
Detta formulär används endast för dokumentationsfeedback. Få reda på hur du får hjälp med HubSpot.