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.

Ändra storleken på en CTA (äldre version)

Senast uppdaterad: 3 augusti 2026

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

Observera: Konton som skapas efter den 17 mars 2025 har inte tillgång till verktyget CTA (äldre version).

Justera storleken på din CTA (äldre version) med hjälp av de inbyggda storleksalternativen och anpassad CSS. När du laddar upp din bild för en bild-CTA kan det vara bra att ta hänsyn till Retina-optimering.

För att ytterligare anpassa din CTA kan du lära dig hur du lägger till anpassade stilar till din CTA (äldre version) med CSS. Om du lägger till din CTA i ett e-postmeddelande eller en mall kan du lära dig hur du centrerar din CTA (äldre version).

Behörigheter krävs Behörigheter som superadministratör eller behörigheter för blogg, e-post, landningssidor eller webbplatssidor krävs för att skapa och redigera CTA:er (äldre version).

Redigera storleken på din CTA (äldre version)

Du kan justera storleken på din CTA manuellt eller använda anpassad CSS för att automatiskt fylla bredden på CTA:ns behållare eller modul. Om du bäddar in en bild-CTA på en webbplats som inte är HubSpot-baserad kan du behöva lägga till ytterligare CSS-deklarationer (t.ex. width: 100%;) i ditt stilark för att göra bild-CTA:n responsiv.

Så här redigerar du storleken på din knapp-CTA:
  1. I ditt HubSpot-konto klickar du på Mer och navigerar sedan till Marknadsföring > CTA:er. Om Mer inte visas i ditt konto navigerar du direkt till Marknadsföring > CTA:er.
  2. Klicka på rullgardinsmenyn längst upp till vänster och välj CTA:er (äldre version).
  3. Håll muspekaren över en CTA och klicka på Åtgärder > Redigera.
  4. Klicka på Avancerade alternativ i det utdragbara fönstret.

ctas-custom-design

  1. Så här ändrar du storleken på din anpassade CTA manuellt:
    • Avmarkera kryssrutan Anpassa till text. Detta tar bort den automatiska storleksanpassningen.
    • I avsnittet Knappavstånd anger du storleksvärdena i fälten för knappens bredd och höjd.
    • Klicka på Nästa >.
    • Klicka på Spara. Klicka sedan på Slutför.
  2. Om du vill att din anpassade CTA ska fylla hela bredden på sin behållare eller modul:
    • Avmarkera kryssrutan ”Storlek automatiskt ”.
    • Ange din anpassade CSS i fältet Anpassad CSS.
    • Ställ in bredden till width: 100%;
    • Klicka på Nästa >.
    • Klicka på Spara. Klicka sedan på Slutför.

Vad är Retina-optimering?

Retina-optimering gör bilden i din CTA skarpare när den visas på dina webbsidor och i e-postmeddelanden om mottagarna visar CTA:n i moderna versioner av Apple Mail och iOS Mail; detta stöds inte av Outlook eller webbmailtjänster som Gmail.

Retina-optimering stöds när du laddar upp en bild som är minst dubbelt så stor som vad som krävs för CTA:n, på samma sätt som Retina-stöd fungerar för alla bilder på internet. Observera även följande:

  • Om du skapar en CTA som ska vara 400px x 100px måste den uppladdade bilden vara 800px x 200px för att stödja en skärm med pixeltätheten @2x.
  • CTA:er stöder upp till en 4x-version. Om du till exempel skapar en CTA som ska vara 400px x 100px kan du ladda upp en bild som är 1600px x 400px.
  • CTA:n kommer automatiskt att visas på din webbplats med ett srcset-attribut som levererar versionerna 1x, 2x, 3x och 4x där sådana finns tillgängliga.
  • Om bilden laddas upp i samma storlek som CTA:n ska visas i, kommer den inte att ha stöd för Retina-skärmar. Om du till exempel laddar upp en bild på 400px × 100px för en CTA på 400px × 100px
Hjälpte artikeln?
Detta formulär används endast för dokumentationsfeedback. Få reda på hur du får hjälp med HubSpot.