Lägg till anpassade stilar till din CTA (legacy)
Senast uppdaterad: januari 29, 2024
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 |
Använd HubSpots avancerade alternativ för CTA:er (legacy) för att skapa mycket anpassade CTA-knappar som passar perfekt med ditt webbplatstema. Du kan använda en anpassad CSS-klass för attstödja anpassade klassinmatningar från din stilmall eller lägga till anpassad CSS direkt till CTA.
För att ytterligare anpassa din CTA (legacy), lär dig hur du redigerar din CTA-storlek. Om du lägger till din CTA (legacy) i ett e-postmeddelande eller en mall kan du läsa om hur du centrerar din CTA.
Observera: anpassade stilar kan endast tillämpas på anpassade knappar och inte på bildknappar.
Så här lägger du till en anpassad stil till din knapp-CTA:
- I ditt HubSpot-konto navigerar du till Marknadsföring > Lead Capture > CTA.
- Klicka på rullgardinsmenyn längst upp till vänster och välj CTA:er (äldre).
- Håll muspekaren över en CTA och klicka på Åtgärder > Redigera, eller klicka på Skapa CTA.
-
I den högra panelen rullar du ner och klickar på Avancerade alternativ.
- Du kan använda anpassad CSS-styling för din CTA genom att endast använda antingen klassen Anpass ad CSS eller alternativet Anpassad CSS. Om båda alternativen används kan det leda till problem med din CTA-styling eller visning .
- Anpassad CSS-klass: lägg till en anpassad klass i din CTA för att stödja inmatningar med anpassade klasser. Detta är användbart när flera CTA:er på dina webbplatssidor behöver dela en liknande uppsättning designegenskaper, t.ex. teckensnittsfamiljer, storlek eller till och med utfyllnad och marginaler. Om du använder en anpassad CSS-klass måste du se till att klassen inkluderas och utformas i CSS-formatmallen som används som huvudformatmall för dina HubSpot-sidor.
- Anpassad CSS: lägg till anpassade stilar som endast ska tillämpas på den CTA du redigerar. I fältet Anpassad CSS kan du tillämpa inline-styling som är specifik för den CTA. Om du har ett element i CTA:n som du vill ändra lägger du till en ny stildeklaration här innan du sparar dina ändringar.
- Klicka på Nästa > längst ned till höger för att slutföra skapandet eller redigeringen av din CTA (legacy).