Konfigurere og style et HubSpot-skjema på et eksternt nettsted

Når du har opprettet et skjema i HubSpot, kan du legge det til på HubSpot-sider eller sider du har opprettet utenfor HubSpot. Skjemaer kan deles på et eksternt nettsted som ikke er hostet i HubSpot:

• Bygge inn skjemakoden på en eksisterende side.
• Opprette en frittstående skjemaside som du kan lenke til.

Uansett hvilken av disse metodene du bruker, vil endringer som gjøres i skjemaet i HubSpots skjemaverktøy automatisk gjenspeiles i skjemaet på det eksterne nettstedet. Når du har lagt til skjemaet, kan du style det innebygde HubSpot-skjemaet på de eksterne sidene i skjemaredigeringsverktøyet eller med CSS i det eksterne stilarket.

Hvis du bruker WordPress, kan du lese mer om hvordan du legger innet skjema i et WordPress-innlegg eller på en WordPress-side.

Legg til koden for skjemainnbygging

• Naviger til Markedsføring > Leadoppfanging > Skjemaer i HubSpot-kontoen din.
• Hold markøren over et skjema, og klikk på Handlinger > Del.
• Hvis du vil legge til kontakter som sender inn skjemaet i en Salesforce-kampanje, klikker du på rullegardinmenyen Legg til kontakter i en Salesforce-kampanje i dialogboksen og velger en kampanje. Hvis du knytter en Salesforce-kampanje til skjemaet, endres skjemaets innebygde kode. I så fall må du legge til innbyggingskoden på nytt på det eksterne nettstedet.
• Klikk på Kopier.
• Lim inn integreringskoden i HTML-modulen på den eksterne siden. Hvis du vil spore analyser for skjemaet ditt, må HubSpot-sporingskoden være installert på den eksterne siden der du plasserer et HubSpot-skjema.

Opprette en frittstående skjemaside

Du kan også dele skjemaet ditt via Del-lenken. I en delekobling vises skjemaet på en frittstående side med en egen URL-adresse. Denne delingslenken kan ikke skjules eller gjøres privat. Alle med delingslenken vil ha tilgang til skjemaet.

• Naviger til Markedsføring > Leadoppfanging > Skjemaer i HubSpot-kontoen din.
• Hold musepekeren over et skjema og klikk på Handlinger > Del.
• Klikk på fanen Delingskobling i dialogboksen.
• Klikk på Kopier for å kopiere skjemasidens URL til utklippstavlen.
• Åpne et nytt vindu eller en ny fane i nettleseren, og lim inn skjemasidens URL-adresse i adressefeltet for å laste den inn. Du kan også dele URL-adressen til skjemasiden direkte med andre for å gi dem tilgang til skjemaet.
  
  

Utform det innebygde skjemaet i skjemaredigeringsprogrammet

Når du skal utforme det innebygde skjemaet i HubSpots skjemaredigeringsprogram, kan du enten bruke et tema eller legge til din egen stil.

Væroppmerksom på at temaer og stiler som er angitt i skjemaredigeringsprogrammet, bare gjelder for innebygde skjemaer eller frittstående skjemasider. Skjemaer på HubSpot-sidene dine kan bare utformes med skjemamodulens stilalternativer i innholdsredigeringsprogrammet.

Tilpasse skjemaet ditt med et tema

Hvis du vil utforme skjemaene dine uten å skrive egen kode, kan du bruke forhåndsinnstilte temaer på det innebygde skjemaet eller den frittstående skjemasiden. Disse temaene gir flere tilpasningsmuligheter for skjemaene dine, i tillegg til eventuelle globale innstillinger for skjemastil.

Slik tilpasser du skjemaet ditt med et tema:

• Naviger til Markedsføring > Leadoppfanging > Skjemaer i HubSpot-kontoen din.
• Hold musepekeren over et skjema, og klikk på Rediger.
• I skjemaredigeringsprogrammet klikker du på fanen Stil og forhåndsvisning .
• Hvis du redigerer et eldre skjema, fjerner du merket for Behold gammelt tema i venstre rute. Dette fjerner den tidligere standard HubSpot-stylingen som ble brukt på dette skjemaet. Eventuell tilpasset CSS eller JavaScript du har lagt til i skjemaet, vil ikke lenger fungere. Denne avmerkingsboksen gjelder ikke for nye skjemaer som opprettes i kontoen din.
• Velg et tema.
• Klikk på Publiser eller Oppdater øverst til høyre.

Bruke en egendefinert stil

Hvis du har et Marketing Hub Starter-, Professional- eller Enterprise-abonnement med HubSpot-kontoen din, kan du også utforme innebygde skjemaer på et mer detaljert nivå.

Slik bruker du en egendefinert stil:

• Naviger til Markedsføring > Leadoppfanging > Skjemaer i HubSpot-kontoen din.
• Hold musepekeren over et skjema og klikk på Rediger.
• I skjemaredigeringsprogrammet klikker du på fanen Stil og forhåndsvisning .
• I venstre rute klikker du påStil-delen. Her kan du konfigurere skjemafeltbredde, skrifttype, skriftstørrelser, skriftfarger og skjemaknapp. Disse stilene angis for hvert enkelt skjema og overstyrer de globale innstillingene for skjemastil.
  
• Når du har tilpasset skjemaet, klikker du på Publiser eller Oppdater øverst til høyre.
  
  

Tilpasse det innebygde skjemaet med CSS i det eksterne stilarket ditt

Hvis du har et Marketing Hub - eller CMS Hub Professional- eller Enterprise-abonnement sammen med HubSpot-kontoen din, kan du bygge inn skjemaet som et HTML-skjema og deretter style det innebygde skjemaet med CSS i det eksterne stilarket.

Slik styler du det innebygde skjemaet med CSS:

• Naviger til Markedsføring > Leadoppfanging > Skjemaer i HubSpot-kontoen din.
• Hold musepekeren over et skjema og klikk på Rediger.
• I skjemaredigeringsprogrammet klikker du på fanen Stil og forhåndsvisning .
• Klikk på for å slå på Angi som rå HTML-skjema . Skjemaet gjengis da som et rå HTML-element på den eksterne siden i stedet for i en iframe, og eventuell standard HubSpot-styling som er brukt på skjemaet, fjernes.
• Klikk på Publiser eller Oppdater øverst til høyre.
• Legg til skjemainnbyggingskoden på den eksterne siden. Hvis du allerede har lagt inn skjemaet, må du erstatte den eksisterende innbyggingskoden med den nye, ustilte versjonen. Når du har innebygd skjemaet:
  
  • Du kan style skjemaet i det eksterne stilarket ditt med CSS.
  • Du kan også endre skjemaets innebygde kode for å gjøre ytterligere skjematilpasninger. Ettersom HubSpot-skjemaer er bygget med JavaScript, ikke HTML, må du få hjelp av en utvikler som vet hvordan man arbeider med JavaScript for å tilpasse skjemainnbyggingskoden.