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.
Forms

Styla ditt inbäddade formulär på externa sidor

Senast uppdaterad: november 2, 2021

Gäller för:

Alla produkter och planer

Styla ditt inbäddade HubSpot-formulär på dina externa sidor på två sätt i formulärredigeraren eller med CSS i ditt externa formatblad.


I formulärredigeraren

Tema

Om du vill styla dina formulär utan att skriva någon anpassad kod kan du tillämpa förinställda teman på ditt inbäddade formulär eller din fristående formulärsida. Temana lägger till fler anpassningsalternativ till dina formulär, utöver eventuella globala inställningar för formulärstilar.

  • I ditt HubSpot-konto, navigera till Marknadsföring > Infångande av potentiell kund > Formulär.
  • Klicka på namnet på ett formulär.
  • Klicka på fliken Stil och förhandsgranskning i formulärredigeraren.
  • Avmarkera kryssrutan Behåll det gamla temat i den vänstra rutan, avsnittet Tema.

Observera: Om du avmarkerar kryssrutan Behåll gammalt tema tas den tidigare standardformatställningen för HubSpot bort som tillämpats på formuläret. Eventuell anpassad CSS eller JavaScript som du har lagt till i formuläret kommer inte längre att fungera. Den här kryssrutan är endast tillgänglig för gamla formulär och kommer inte att finnas tillgänglig i nya formulär som skapas på ditt konto.

  • Välj ett av fyra teman.

Stil (endastMarketing Hub Starter, Professional, Enterprise eller Legacy Marketing Hub Basic).

Förutom teman kan du styla inbäddade formulär på en mer detaljerad nivå.

  • I ditt HubSpot-konto, navigera till Marknadsföring > Infångande av potentiell kund > Formulär.
  • Klicka på namnet för ett formulär.
  • Klicka på fliken Style & Preview i formulärredigeraren.
  • I den vänstra rutan klickar du på avsnittet > Style för att expandera det. Här kan du styra formulärfältets bredd, teckensnittsfamilj, teckensnittsstorlek, teckensnittsfärg och formulärknapp.

Dessa stilar ställs in för varje enskilt formulär och åsidosätter globala inställningar för formulärstilar.

Observera att teman och stilar som ställs in i formulärredigeraren endast gäller för inbäddade formulär eller fristående formulärsidor. Formulär på dina HubSpot-sidor kan endast stylas med formmodulens stilalternativ i innehållsredigeraren.

Med CSS i ditt externa formatmallark (Marknadsföringshubben Professional, Enterprise eller Legacy Marketing Hub Endast Basic )

  • I ditt HubSpot-konto, navigera till Marknadsföring > Infångande av potentiell kund > Formulär.
  • Klicka på namnet på formuläret.
  • I formulärredigeraren klickar du på fliken Stil och förhandsgranskning .
  • Klicka för att aktivera inställningen Ange som rått HTML-formulär . Formuläret kommer att återges som ett obearbetat HTML-element på din externa sida i stället för i en iframe, och alla standardformat för HubSpot som tillämpas på formuläret kommer att tas bort.

options-unstyled-form

  • Klicka på Dela i övre högra hörnet.
  • I dialogrutan klickar du på Kopiera för att kopiera koden för inbäddning av formuläret.
  • Lägg till koden för inbäddning av formuläret på din externa sida. Om du redan har bäddat in formuläret måste du ersätta den befintliga inbäddningskoden med den här nya, ostylerade versionen.
  • När du har bäddat in formuläret kan du styla formuläret i ditt externa formatmall med CSS.
  • Alternativt kan du ändra koden för inbäddning av formuläret för att göra ytterligare anpassningar av formuläret. Eftersom HubSpot-formulär byggs med JavaScript, inte HTML, kan du anpassa koden för inbäddning av formuläret på följande sätt kräver hjälp av en utvecklare som vet hur man arbetar med JavaScript.