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 moduler för bildreglage

Senast uppdaterad: oktober 30, 2023

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

Alla produkter och planer

Med modulen Image Slider kan du visa flera bilder i en och samma modul. Du kan ställa in så att bilderna visas automatiskt, eller så kan du hjälpa besökarna att manuellt växla mellan dem.

Lägg till och redigera bilder i bildreglage-moduler

  • Navigera till ditt innehåll:

    • Sidor på webbplatsen: I ditt HubSpot-konto navigerar du till Innehåll > Webbplatssidor.
    • Landningssidor: I ditt HubSpot-konto navigerar du till Innehåll > Landningssidor.
    • Blogg: I ditt HubSpot-konto navigerar du till Innehåll > Blogg.
  • Håll muspekaren över innehållet och klicka sedan på Redigera.
  • I innehållsredigeraren klickar du på ikonen add Lägg till i det vänstra sidofältet.
  • Klicka för att expandera kategorin Media , klicka sedan på modulen Image Slider och dra den till rätt position.
  • Håll muspekaren över en bild i det vänstra sidofältet och klicka på ikonen edit Redigera för att lägga till en bild i bilden:
    • I avsnittet Bild klickar du på Ladda upp för att välja en bild från din dator eller Bläddra bland bilder för att välja en bild från filverktyget.
    • I fältet Bildtext anger du en bildtext som ska visas under bilden. Om du vill visa bilden utan bildtext tar du bort standardtexten.
    add-image-and-caption-to-image-slider
    • Lägg till en länk till bilden:
      • Klicka på rullgardinsmenyn Länk till och välj en länktyp.
      • Ange länkens destination i fältet som visas. Läs mer om hur du arbetar med länkar i HubSpot.
      • Om du vill hålla ditt innehåll öppet och låta länken öppnas i ett nytt fönster klickar du på knappen Öppna länk i nytt fönster .
      • För att identifiera länkdestinationen som inte en del av dina webbplatser för sökmotorer, markera kryssrutan Följ inte .
    • Klicka på Tillämpa ändringar för att spara ändringarna i bilden.
  • Klicka på Bildreglaget högst upp i sidofältredigeraren för att återgå till modulöversikten.

go-back-to-image-slider-overview

  • Om du vill lägga till fler bilder håller du muspekaren över en annan bild och klickar på ikonen edit Redigera .
  • Om du vill slutföra ändringarna klickar du på Verkställ ändringar.

Redigera inställningar för bildreglage-moduler

  • Navigera till ditt innehåll:

    • Sidor på webbplatsen: I ditt HubSpot-konto navigerar du till Innehåll > Webbplatssidor.
    • Landningssidor: I ditt HubSpot-konto navigerar du till Innehåll > Landningssidor.
    • Blogg: I ditt HubSpot-konto navigerar du till Innehåll > Blogg.
  • Håll muspekaren över innehållet och klicka sedan på Redigera.
  • Klicka på modulen för bildreglage i innehållsredigeraren.
  • Klicka på Inställningar i sidofältredigeraren för att redigera modulens inställningar.
  • Klicka för att expandera avsnittet Bilder för att redigera bildalternativ:
    • I fältet Bilder per sida anger du hur många bilder som ska visas samtidigt i bildreglaget. Du kan visa upp till fem bilder åt gången. När du väljer flera bilder åt gången visas inte bildtexter och miniatyrbilder.
    • I avsnittet Bildstorlek väljer du ett alternativ för bildförhållande. Som standard visas bilderna med sitt eget bildförhållande. Om du vill standardisera ett enda bildförhållande för alla bilder väljer du Tvinga bildförhållande. Detta kan leda till att vissa bilder visas förvrängda.

edit-slide-settings

  • Klicka för att expandera sektionen Rörelse för att redigera alternativ för bildövergångar:
    • Om du vill att bilderna ska upprepas när den sista bilden nås markerar du kryssrutan Loopa bilder .
    • Om du vill att bilderna ska visas automatiskt markerar du kryssrutan Autoplay . Om du har färre bilder än inställningen Bilder per sida kan ingen cykling ske.
  • Klicka för att expandera avsnittet Navigering för att redigera navigeringsalternativ:
    • Markera kryssrutan Visa navigeringspilar om du vill visa pilar som gör det möjligt för besökare att manuellt växla mellan bilder.
    • Om du vill visa miniatyrbilder under navigeringen markerar du kryssrutan Visa miniatyrbilder .
    • Om du vill visa punkter under bilderna som visar det totala antalet bilder och låter besökarna välja en specifik bild markerar du Visa punktnavigering.
  • Om du vill slutföra ändringarna klickar du på Verkställ ändringar.

Redigera stilar för bildgallerimoduler

  • Navigera till ditt innehåll:

    • Sidor på webbplatsen: I ditt HubSpot-konto navigerar du till Innehåll > Webbplatssidor.
    • Landningssidor: I ditt HubSpot-konto navigerar du till Innehåll > Landningssidor.
    • Blogg: I ditt HubSpot-konto navigerar du till Innehåll > Blogg.
  • Håll muspekaren över innehållet och klicka sedan på Redigera.
  • Klicka på modulen för bildreglage i innehållsredigeraren.
  • Klicka på fliken Stilar i sidofältredigeraren.
  • Om du vill ange hur rundade hörnen på dina bilder ska vara klickar du på Bilder och sedan på för att expandera avsnittet Bilder . Ange pixelvärden i fältet Hörnradie . Ju högre värde, desto mer rundade blir hörnen.
    • Om du vill lägga till marginaler ovanför eller under dina bildtexter klickar du för att expandera avsnittet Bakgrund och anger sedan pixelvärden i fälten Marginal ovanför och Marginal nedanför .
    • Om du vill lägga till utfyllnad till dina bildtexter anger du ett pixelvärde i fältet Utfyllnad . Om du vill lägga till separata värden för varje sida klickar du på Redigera separat och anger sedan pixelvärden i fälten.
    • Om du vill lägga till en bakgrundsfärg till dina bildtexter anger du ett hexvärde i det första fältet i avsnittet Färg , eller klickar på färgväljaren och väljer en färg. Anpassade färger kan läggas till från fliken Avancerat .
    • För att ställa in en bakgrundsfärgs transparens anger du ett procentvärde i det andra fältet i avsnittet Färg . En transparens på 100 % är ogenomskinlig, medan en transparens på 0 % inte syns.
    edit-slide-settings
    • Om du vill redigera teckensnittet i dina bildtexter klickar du på för att expandera avsnittet Text, klickar sedan på rullgardinsmenyn Välj teckensnitt och väljer ett teckensnitt.
    • Om du vill ändra teckenstorleken klickar du på rullgardinsmenyn Storlek och väljer en teckenstorlek.
    • Om du vill ändra teckensnittsfärg klickar du på färgväljaren och väljer en färg. Anpassade färger kan läggas till från fliken Avancerat .
    • Ändra teckensnittsvikt genom att klicka på en teckensnittsviktsikonbold för fet, kursiverad eller understruken text.Om du vill redigera utseendet på bildtexterna klickar du på Bilder och sedan på Bildtexter:
  • Så här redigerar du utseendet på skjutreglagets pilar:
    • Klicka på Navigering.
    • Klicka för att expandera avsnittet Skjutreglagespilar .
    • Om du vill ange bakgrundsfärg för vänster- och högerikonerna anger du ett hexvärde i det första fältet i avsnittet Bakgrundsfärg eller klickar på färgväljaren och väljer en färg. Anpassade färger kan läggas till från fliken Avancerat .
    • Ange bakgrundsfärgens transparens genom att ange ett procentvärde i det andra fältet i avsnittet Bakgrundsfärg . En transparens på 100% kommer att vara ogenomskinlig, medan en transparens på 0% inte kommer att vara synlig.
    • Om du vill ersätta ikonerna för vänster- och högerpilarna klickar du på Ersätt ovanför fälten Vänsterikon och Högerikon . Välj en ikon i den högra panelen.
    change-image-slider-arrow-icons
    • Ange färgen på vänster- och högerikonerna genom att ange ett hexvärde i det första fältet i avsnittet Ikonfärg, eller klicka på färgväljaren och välj en färg. Anpassade färger kan läggas till från fliken Avancerat .
    • Ange bakgrundsfärgens transparens genom att ange ett procentvärde i det andra fältet i avsnittet Ikonfärg . En transparens på 100 % är ogenomskinlig, medan en transparens på 0 % inte syns.
  • Ändra utseendet på prickarna under bilderna och autoplay-knappen:
    • Klicka på Navigering.
    • Klicka för att expandera avsnittet Prickar och autoplay-knapp.
    • Ange ett hex-värde i det första fältet i avsnittet Färg , eller klicka på färgväljaren och välj en färg. Anpassade färger kan läggas till från fliken Avancerat .
  • Så här ändrar du utseendet på miniatyrbildsnavigeringen:
    • Klicka på Navigering.
    • Klicka här för att expandera avsnittet Miniatyrnavigering .
    • Om du vill ange bakgrundsfärg för vänster- och högerpilarna anger du ett hex-värde i det första fältet i avsnittet Pilarnas bakgrundsfärg , eller klickar på färgväljaren och väljer en färg. Anpassade färger kan läggas till från fliken Avancerat .
    • Ange bakgrundsfärgens transparens genom att ange ett procentvärde i det andra fältet i avsnittet Pilarnas bakgrundsfärg . En transparens på 100% kommer att vara ogenomskinlig, medan en transparens på 0% inte kommer att vara synlig.
    • Om du vill ersätta ikonerna för vänster- och högerpilarna klickar du på Ersätt ovanför fälten Pil vänster ikon och Pil höger ikon . Välj en ikon i den högra panelen.
  • arrow-left-in-image-slider
    • Du ställer in färgen på vänster och höger pilikon genom att ange ett hex-värde i det första fältet i avsnittet Fyllningsfärg för pilikon, eller klicka på färgväljaren och välj en färg. Anpassade färger kan läggas till från fliken Avancerat .
    • Ange pilens transparens genom att ange ett procentvärde i det andra fältet i avsnittet Ikonfärg . En transparens på 100 % blir ogenomskinlig, medan en transparens på 0 % inte syns.
    • Klicka här för att expandera avsnittet Miniatyrbilder .
    • Om du vill ange vilket bildförhållande som ska användas för alla miniatyrbilder klickar du på rullgardinsmenyn Bildförhållande och väljer ett bildförhållande.
    • Ange vilken bredd som ska användas för alla miniatyrbilder genom att ange ett pixelvärde i fältet Bredd .
    • Ange ett pixelvärde i fältet Radius för att ange hur rundade hörnen på miniatyrbilderna ska vara. Ju högre värde, desto mer rundade blir hörnen.

edit-thumbnail-images-settings

  • Så här redigerar du skjutreglagets avstånd:
    • Klicka på Skjutreglage.
    • Klicka för att expandera avsnittet Avstånd .
    • Lägg till marginaler ovanför och under reglaget genom att ange pixelvärden i fälten Marginal ovanför och Marginal nedanför .
    • Om du vill lägga till utfyllnad i skjutreglaget anger du ett pixelvärde i fältet Utfyllnad . Om du vill lägga till separata värden för varje sida klickar du på Redigera separat och anger sedan pixelvärden i fälten.
Hjälpte artikeln?
Detta formulär används endast för dokumentationsfeedback. Få reda på hur du får hjälp med HubSpot.