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.

Lägg till anpassade stilar till din CTA-knapp

Senast uppdaterad: juni 28, 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

Använd HubSpot's avancerade alternativ för CTA-knappar för att skapa mycket anpassade CTA-knappar som passar perfekt till temat på din webbplats. Du kan använda en anpassad CSS-klass för att stödja anpassade klassinmatningar från ditt formatmallblad eller lägga till anpassad CSS direkt i CTA-knappen.

Om du vill anpassa din knapp CTA ytterligare kan du lära dig hur du redigerar din CTA-storlek. Om du lägger till din CTA-knapp i ett e-postmeddelande eller en mall kan du lära dig hur du centrerar din CTA-knapp

.



Observera: anpassade stilar kan endast tillämpas på anpassade knappar och intebildknappar.

Så här lägger du till en anpassad stil till din CTA-knapp:

  • I ditt HubSpot-konto navigerar du till Marknadsföring > Lead Capture > Button CTAs.
  • Håll muspekaren över en knapp 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 tillämpa anpassad CSS-formgivning på din knapp CTA genom att endast använda antingen klassen Anpassad CSS eller alternativet Anpassad CSS. Om båda alternativen tillämpas kan det leda till problem med stylingen eller visningen av din knapp CTA.
    • Anpassad CSS-klass: Lägg till en anpassad klass till din knapp CTA för att stödja inmatningar med anpassad klass. Detta är användbart när flera CTA:er på webbplatsens sidor måste dela en liknande uppsättning designegenskaper, t.ex. typsnittsfamiljer, storlek eller till och med utfyllnad och marginaler. Om du använder en anpassad CSS-klass ska du se till att klassen inkluderas och stylas i det CSS-formatblad som används som huvudformat för dina HubSpot-sidor.
    • Anpassad CSS: Lägg till anpassade stilar som endast ska tillämpas på den CTA-knapp som du redigerar. I fältet Anpassad CSS kan du tillämpa inline-formgivning som är specifik för denna knapp CTA. Om du har ett element i knappen CTA som du vill ändra lägger du till en ny stildeklaration här innan du sparar dina ändringar.
  • Klicka på Nästa > längst ner till höger för att avsluta skapandet eller redigeringen av din knapp CTA.

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