Senast uppdaterad: maj 22, 2023
Tillgänglig med något av följande abonnemang, om inte annat anges:
Marketing Hub Professional, Enterprise
|
CMS Hub Professional, Enterprise
|
| Tidigare Marketing Hub Basic |
Justera storleken på din knapp CTA med hjälp av de inbyggda storleksalternativen och anpassad CSS. När du laddar upp din bild för en bild-CTA kan du ta hänsyn till retinaoptimering
.Om du vill anpassa din knapp CTA ytterligare kan du lära dig hur du lägger till anpassade stilar till din CTA med CSS. Om du lägger till din knapp CTA i ett e-postmeddelande eller en mall kan du lära dig hur du centrerar din CTA
.
Redigera din CTA-storlek
Du kan justera storleken på din knapp CTA manuellt eller använda anpassad CSS för att automatiskt fylla bredden på knappens CTA-behållare eller modul. Om du bäddar in en CTA-bild på en webbplats som inte är HubSpot kan du behöva tillämpa ytterligare CSS-deklarationer (t.ex. width: 100 %;) i formatmallen för att göra CTA-bilden responsiv.Så härredigerar du storleken på din knapp CTA:
- I ditt HubSpot-konto navigerar du till Marketing > Lead Capture > Knapp CTA:er.
- Håll muspekaren över en CTA-knapp och klicka på Åtgärder > Redigera.
- Klicka på Avancerade alternativ i panelen.
- Om du vill ändra storleken på din anpassade knapp CTA manuellt:
- Avmarkera kryssrutan Anpassa till text. Detta kommer att ta bort den automatiska storleksändringen som tillämpas.
- I avsnittet Button padding anger du dina storleksvärden för fälten button width och button height.
- Klicka på Nästa >.
- Klicka på Spara. Klicka sedan på Slutför.
- Om du vill att din anpassade CTA-knapp ska fylla hela bredden på behållaren eller modulen:
- Avmarkera kryssrutan Storlek automatiskt .
- Angedin anpassade CSS i fältetAnpassad CSS .
- Ställ in bredden på width: 100 %;
- Klicka på Nästa >.
- Klicka på Spara. Klicka sedan på Slutför.
Vad är retinaoptimering?
Retinaoptimering gör bilden av din knapp CTA mer skarp när den visas på webbplatsens sidor och i e-postmeddelanden om dina mottagare visar CTA:n i moderna versioner av Apple Mail och iOS mail; detta stöds inte av Outlook eller webbmailtjänster som Gmail.
Retinaoptimering stöds när du laddar upp en bild som är minst två gånger så stor som krävs för knappens CTA, på samma sätt som retinastödet fungerar för alla bilder på internet. Observera också följande:
- Om du skapar en CTA-knapp som ska vara 400px x 100px måste den uppladdade bilden vara 800px x 200px för att stödja en @2x pixeltäthet.
- CTA:er har stöd för att lägga till upp till en 4x-version. Om du till exempel skapar en CTA som kommer att vara 400 x 100 pixlar kan du ladda upp en bild på 1600 x 400 pixlar.
- CTA-bilden kommer automatiskt att återges på din webbplats med ett srcset-attribut som serverar 1x-, 2x-, 3x- och 4x-versionen där det finns tillgängligt.
- Om bilden laddas upp i den storlek som CTA-meddelandet kommer att visas i kommer den inte att ha retinastöd. Om t.ex. en bild på 400px x 100px laddas upp för en CTA på 400px x 100px