- Kunnskapsdatabase
- Markedsføring
- Skjemaer
- Utform og legg inn HubSpot-skjemaer på et eksternt nettsted
Utform og legg inn HubSpot-skjemaer på et eksternt nettsted
Sist oppdatert: 5 august 2026
Bruk HubSpot-skjemaer på din eksterne nettside for å registrere potensielle kunder og synkronisere kontaktopplysningene automatisk til HubSpot-kontoen din. Du kan tilpasse utseendet på skjemaet i HubSpot og bruke innleggingskoden for å legge det inn på nettsiden din. Eller bruk en delingslenke for å sende et frittstående skjema til målgruppen din.
Når du legger inn et skjema, sikres det at innsendingene synkroniseres direkte til HubSpot-kontoen din, der du kan administrere kontakter, utløse automatisering og analysere ytelsen. Du kan for eksempel legge til et HubSpot-skjema på en produktside på bedriftens nettsted for å registrere forespørsler om demoer og følge opp med en automatisert e-post.
Hvis skjemaet ditt ble opprettet i den gamle skjemaeditoren, kan du lære hvordan du konfigurerer og utformer et gammelt skjema på et eksternt nettsted.
Før du setter i gang
Før du begynner å bruke denne funksjonen, bør du gå gjennom de tekniske kravene og hensynene ved bruk av skjemaer på eksterne nettsteder.
Krav
Tillatelser påkrevd Du må ha redigeringsrettigheter for skjemaer for å kunne opprette eller redigere et skjema.
- For å spore statistikk på det innebygde skjemaet ditt, må du installere HubSpot -sporingskoden på den eksterne siden din.
- Når du legger inn et HubSpot-skjema på et eksternt nettsted, må du legge til nettstedets domene i sporingsinnstillingene dine. Skjemaer som sendes inn fra domener som ikke er lagt til, vil bli merket som spam.
Begrensninger og hensyn
- Det er ikke mulig å angi skjemaet som et rått HTML-skjema i den oppdaterte skjemaeditoren. Kun skjemaer som er laget med den gamle skjemaeditoren, kan angis som rått HTML.
- For å tilpasse et skjemaets innebyggingskode trenger du hjelp fra en utvikler som kan arbeide med JavaScript. Mer avansert tilpasning kan gjøres med et skreddersydd skjema og HubSpot Forms API.
Utform skjemaet ditt
Tilpass tekst, inndatafelt, knapper og bakgrunn for skjemaet og skjemaets trinn. Tilpasninger av skjemaets utseende gjelder for alle trinn i skjemaet. Du kan ikke tilpasse utseendet på enkeltstående trinn separat.
- I HubSpot-kontoen din klikker du på Mer og navigerer deretter til Markedsføring > Skjemaer. Hvis Mer ikke vises i kontoen din, navigerer du direkte til Markedsføring > Skjemaer.
- Opprett et nytt skjema, eller hold musepekeren over et eksisterende skjema og klikk på Rediger.
- I menyen i venstre sidepanel klikker du på ikonet « styles -stil».
- Fra panelet «Form styles » kan du tilpasse følgende komponenter:
- Felter: Tilpass feltet, inkludert bakgrunn og rammer. Du kan også tilpasse skrift, skriftstørrelse og farger for etikettene, samt fargene for hjelpetekst, plassholdere og feilmeldinger.
- Knapper: Tilpass knappens høyde, avrundede hjørner, bakgrunn og fargeovergang, og legg til en skyggelegging på knappen. Du kan også tilpasse skrifttypen, skriftstørrelsen og fargen på knappeteksten.
- Avsnitt (rik tekst): Tilpass skrifttypen, skriftstørrelsen og fargen på brødteksten.
- Overskrift: Tilpass skrifttypen og tekstfargen til overskriften din. Du kan velge å legge til en skyggelegging på overskriftsteksten.
- Bakgrunn: Tilpass bakgrunnen for skjemaet og skjemaets trinn. Du kan velge å angi en bakgrunnsfarge eller bruke et bilde som bakgrunn. Du kan bruke AI-assistenter til å generere bilder. Du kan også velge å angi en ramme for skjemaet.
- Fremdriftslinje: Tilpass fremdriftslinjen i skjemaet ditt, inkludert fargen på fremdriftslinjen og skrifttypen til fremdriftslinjen.

Del en frittstående skjema-side
Bruk en delingslenke for å vise skjemaet ditt på en egen side. Alle som har delingslenken, kan få tilgang til skjemaet. URL-adressene til delingslenkene genereres automatisk og kan ikke redigeres eller tilpasses.
Slik kopierer du delingslenken:
- I HubSpot-kontoen din klikker du på Mer og navigerer deretter til Markedsføring > Skjemaer. Hvis Mer ikke vises i kontoen din, navigerer du direkte til Markedsføring > Skjemaer.
- Hold musepekeren over et skjema, og klikk på Rediger.
- Øverst til høyre klikker du på Gjennomgå og oppdater.
- Klikk på Oppdater nederst i panelet til høyre.
- I dialogboksen klikker du på Kopier en delingslenke.
- Klikk på Kopier nederst. Dette kopierer sidens nettadresse til utklippstavlen.
- Åpne et nytt vindu eller en ny fane i nettleseren din, og lim inn sidens URL i adressefeltet for å laste den inn. Du kan også dele URL-en til skjemaet direkte med andre for å gi dem tilgang til skjemaet.
Kopier innleggingskoden for skjemaet
Legg inn skjemaet på en ekstern side ved å kopiere innleggingskoden og lime den inn på den eksterne siden. For å spore statistikk for det innlagte skjemaet må HubSpot-sporingskoden være installert på den eksterne siden der du legger inn HubSpot-skjemaet.
Slik kopierer du innleggingskoden:
- I HubSpot-kontoen din klikker du på Mer og navigerer deretter til Markedsføring > Skjemaer. Hvis Mer ikke vises i kontoen din, navigerer du direkte til Markedsføring > Skjemaer.
- Hold musepekeren over et skjema og klikk på Rediger.
- Klikk på Gjennomgå og oppdater øverst til høyre.
- Klikk på «Oppdater» nederst i panelet til høyre.
- I dialogboksen klikker du på «Hent innebyggingskode».
- Klikk på Kopier på fanen Innbyggingskode.
- Lim inn innleggingskoden i HTML-modulen på den eksterne siden din.
Få tilgang til utviklerkoden for skjemaet
Abonnement påkrevd Du må ha et Marketing Hub- eller Content Hub Professional- eller Enterprise-abonnement for å få tilgang til utviklerkoden for skjemaet.
Legg inn skjemaet ditt og tilpass stilen ved hjelp av CSS i det eksterne stilarket ditt. Med denne metoden kan du overstyre standardstiler, bruke detaljert styling på bestemte skjemaelementer og angi globale regler for ensartet styling på tvers av de innlagte skjemaene dine. Les mer om hvordan du definerer tilpasset styling for innlagte skjemaer ved hjelp av CSS.
Slik får du tilgang til utviklerkoden:
- I HubSpot-kontoen din klikker du på Mer og navigerer deretter til Markedsføring > Skjemaer. Hvis Mer ikke vises i kontoen din, navigerer du direkte til Markedsføring > Skjemaer.
- Hold musepekeren over et skjema og klikk på Rediger.
- Klikk på Gjennomgå og oppdater øverst til høyre.
- Klikk på Oppdater nederst i panelet til høyre.
- I dialogboksen klikker du på «Hent innebyggingskode».
- Klikk på fanen Utviklerkode (Avansert).
- Hvis du aksepterer risikoen for at endringer gjort eksternt i CSS eller JavaScript kan føre til at skjemaet slutter å fungere, merker du av for Jeg forstår risikoen, vis meg koden.
- Klikk på «Kopier» nederst.
- Legg til innbyggingskoden for skjemaet på den eksterne siden din. Etter at du har lagt inn skjemaet, kan du formatere det i det eksterne stilarket ditt med CSS.
- CSS-variablene du kan overstyre, er oppført i denne artikkelen.
- Globale stiler vil overstyre stiler på øverste nivå i alle dine innebygde skjemaer. Du kan også målrette mot enkeltelementer i skjemaene dine, for eksempel en rad med skjemaelementer, sendeknapper eller skjemaoverskrifter.
