Gå til innhold
Merk:: Denne artikkelen er oversatt av praktiske årsaker. Oversettelsen opprettes automatisk ved hjelp av oversettingsprogramvare, og det er ikke sikkert at den er korrekturlest. Den engelske versjonen av denne artikkelen skal regnes som den regjerende versjonen med den nyeste informasjonen. Du finner den her.

Bruk skrifter i HubSpot

Sist oppdatert: 18 mai 2026

Tilgjengelig med et av følgende abonnementer, unntatt der det er angitt:

Skrifttyper i HubSpot er tilgjengelige på ulike måter, avhengig av innholdstype og skrifttypetype. Noen standardskrifttyper er tilgjengelige i alle innholdsredigerere. Webskrifttyper og egendefinerte skrifttyper må kanskje legges til i temainnstillinger, stilark, egendefinerte moduler eller kodede maler.

Før du setter i gang

Før du begynner å bruke skrifttyper i HubSpot, bør du gå gjennom kravene og hensynene.

Tillatelser påkrevd En bruker kan trenge tilleggsrettigheter avhengig av hvor skrifttypen brukes:

Forstå begrensninger og hensyn

  • Ikke alle innholdstyper er tilgjengelige i alle kontoer. For å bekrefte hvilke innholdstyper som er tilgjengelige for abonnementet ditt, kan du se gjennom produkt- og tjenestekatalogen.
  • Se tabellen nedenfor for å forstå hvilke skriftalternativer som er tilgjengelige for hver innholdstype:
Innholdstype Skrifttype  
  Standardskrifter Webfonter

Tilpassede skrifttyper

  
Side – temamaler ✓ Tilgjengelig i temainnstillinger og via stilark ✓  
Side – kodet mal ✓ Tilgjengelig via stilark eller tilpasset modul Tilgjengelig via stilark  
Blogg ✓ Tilgjengelig via stilark eller tilpasset modul ✓  
E-post Noen standardskrifter er ikke tilgjengelige i dra-og-slipp-redigeringsverktøyet for e-post Kun tilgjengelig for e-postmaler med tilpasset koding; støttes ikke i de fleste e-postklienter Kun tilgjengelig for e-postmaler med tilpasset koding; støttes ikke i de fleste e-postklienter  
Kunnskapsbase Skrifttyper kan ikke tilpasses i artikkelredigereren Tilgjengelig i temainnstillinger  Tilgjengelig i temainnstillinger  
Tilpasset modul ✓ Tilgjengelig for tilpassede moduler som ikke brukes i e-poster Tilgjengelig for tilpassede moduler som ikke brukes i e-poster  
CTA (eldre versjon) ✓ ✓ ✓  
CTA ✓ ✓ ✓  

Bruk standardskrifter i rik tekst-moduler

Standardskrifter støttes i alt HubSpot-innhold, men de tilgjengelige alternativene og hvor du kan bruke dem, avhenger av innholdstypen.

  1. Naviger til innholdet ditt:

  2. Klikk på navnet på innholdet ditt.
  3. I innholdsredigereren klikker du på enrik tekst-modul, og markerer deretter teksten du vil redigere. 
  4. I verktøylinjen for rik tekst klikker du pårullegardinmenyen Fontog velger en skrift. Følgende skrifter er tilgjengelige i moduler for rik tekst:

Bruk nettfonter

Nettfonter støttes i noe HubSpot-innhold, men de er ikke tilgjengelige i nedtrekksmenyen Font i riktekstredigereren. Avhengig av innholdstypen kan nettfonter brukes i temainnstillinger, stilark, tilpassede moduler eller kodede maler. 

Utviklere kan bruke fontfeltet til å legge til nettfonter i temaer og tilpassede moduler. Når nettfonter legges til på denne måten, laster HubSpot dem direkte på innholdets domene i stedet for å laste dem fra en tredjepartstjeneste.

Bruk tredjepartstjenester som Google Fonts ved å kopiere fontens importkode, lime den inn i innholdets stilark og deretter bruke fonten via CSS:

  1. Gå til fonts.google.com.
  2. Skriv inn etskrifttypenavn i søkefeltet. 
  3. Klikk på fontnavnet for å se en liste over stiler som er tilgjengelige for import.
  4. Klikk på Hent skrift øverst til høyre.
  5. Klikk på Hent innebyggingskode øverst til høyre.
  6. I høyre kolonne velger du @import på fanen Web.
  7. Kopier @import- koden uten <style> -taggen.
  8. KopierCSS-klassekoden for å angi CSS-regler. 

On the Google Fonts page, the Web tab is displayed for embedding a Google Font. A box is placed around the embed code and the Copy code button for the CSS class.

  1. Når du har kopiert koden fra Google Fonts, kan du legge til skrifttypen i HubSpot-innholdet ditt: 

Bruk en Google Font i et stilark

  1. Kopier skriftens @import-kode fra Google Fonts.
  2. Gå til Innhold > Design Manager i HubSpot-kontoen din.
  3. Åpne stilarket som brukes for innholdet ditt i Finder.
  4. Lim inn @import-koden i linje 1 i stilarket. 
  5. Legg til koden for å angi CSS-regler til de aktuelle selektorene i stilarket.
  6. Klikk påPubliser endringer øverst til høyre for å publisere endringene dine. 
In the design manager, a CSS file is displayed. In the code editor, a Google Font import code is at the top of the file, followed by CSS rules to appropriate selectors in the stylesheet.

Bruk en Google Font i en tilpasset kodet e-postmal

Google Fonts støttes i Apple Mail og noen få andre e-postklienter, men bred støtte er begrenset. De fleste populære e-postklienter støtter kun standard nettfonter. Lær mer om å velge standardfonter som brukes i den klassiske e-postredigereren. 

Abonnement påkrevd Det kreves et Marketing Hub Professional- eller Enterprise-abonnement for å lage tilpassede kodede e-postmaler.


Slik legger du til en Google Font i en tilpasset kodet e-postmal: 

  1. Kopier skriftens @import-kode fra Google Fonts.
  2. Gå til Innhold > Design Manager i HubSpot-kontoen din.
  3. Åpne den tilpassede e-postmalen i Finder.
  4. I delen<head> i malen limer du inn @import-koden mellom taggene <style>....</style>. 
  5. I delen <body> i malen legger du til den tilpassede skrifttypen i innebygd styling. 
  6. Klikk på Publiser endringerøverst til høyre for å publisere endringene dine. 

Bruk en Google-skrift i en CTA (eldre versjon)

  1. Kopier Googles kode for å angi CSS-regler for den skrifttypen.
  2. Gå til Markedsføring > CTA-er i HubSpot-kontoen din.
  3. Hold musepekeren over en CTA, og klikk deretter på Handlinger > Rediger. 
  4. Klikk påAvanserte alternativer i panelet til høyre. 
  5. Lim inn Googles kode for å angi CSS-regler for den skrifttypen i tekstboksen. 
  6. Klikk påNeste nederst til høyre. Klikk deretter på Lagre.

Bruk en Google-skrift i et skjema

  1. I HubSpot-kontoen din navigerer du til Markedsføring > Skjemaer.
  2. Hold musepekeren over skjemaets navn og klikk på Handlinger > Rediger skjema eller Opprett et nytt skjema.
  3. I skjemaeditoren klikker du på fanen Stil og forhåndsvisning. 
  4. I menyen i venstre sidepanel klikker du pådelen Stil.
  5. Idelen Tekstklikker du på rullegardinmenyenSkriftfamilie og velger enGoogle-skrift. 
  6. Klikk påOppdater ellerPubliser øverst til høyre for å publisere endringene. 

Bruk en Google-skrift i en tilpasset modul

Merk: Google-skrifter er ikke tilgjengelige for tilpassede moduler som brukes i e-postmaler.

  1. Gå til Innhold > Design Manager i HubSpot-kontoen din.
  2. I søkefeltet klikker du på navnet på en tilpasset modul. Les mer om hvordan du oppretter en tilpasset modul.
  3. I inspektøren klikker du på rullegardinmenyen Legg til feltifeltseksjonenog velger Skrift. Les mer om hvordan du arbeider med skriftfelt.
In the design manager, the inspector is displayed for a custom module. A box is placed around the Add field dropdown menu in the Fields section.
  1. Klikk på Publiser endringerøverst til høyre forå publisere endringene dine. 
  2. Naviger til innholdet ditt:
  3. Klikk på navnet på innholdet ved hjelp av den tilpassede modulen. 
  4. I innholdsredigereren klikker du på dentilpassede modulen. 
  5. I sidefeltredigereren klikker du pårullegardinmenyeniFont-feltetog velger enGoogle Font. 

Bruk tilpassede skrifttyper

Som et alternativ til å bruke standard webskrifttyper eller et skrifttypebibliotek somGoogle Fonts, kan du laste opp skrifttypfiler og deretter bruke dem i temaer eller referere til dem i stilark.

Bruk tilpassede skrifttyper i temaer

I temaredigereren laster du opp en tilpasset skrifttype og bruker den deretter på sider og innlegg. Skrifttypfiler støttes i følgende formater: TTF, OTF, WOFF.

Last opp egendefinerte skrifttyper for sider eller innlegg

Når du har lastet opp egendefinerte skrifttyper, vil de være tilgjengelige for sider, innlegg eller kunnskapsbaseartikler.

  1. Naviger til innholdet ditt:

  2. Klikk på navnet på innholdet ditt. 
  3. I innholdsredigereren klikker du påRediger-menyenog velgerTema: [Navn på tema].
  4. I menyen i venstre sidefelt klikker du på en hvilken som helstnedtrekksmeny for skrifttyper og velgerAdministrer merkevareskrifttyper.
  5. Følg trinnene i denne kunnskapsbaseartikkelen for å legge til eller redigere skrifttypene dine.

Last opp egendefinerte

skrifttyper

for kunnskapsbaseartikler

Når du har lastet opp egendefinerte skrifttyper, vil de være tilgjengelige for sider, innlegg eller kunnskapsbaseartikler.

  1. Gå til Service > Kunnskapsbase i HubSpot-kontoen din.
  2. Klikk påTilpass mal øverst til høyre.
  3. Klikk på Design -fanen i venstre sidefelt.
  4. Klikk på Skriftstiler i venstre sidefelt.
  5. Klikk på en hvilken som helst skrifttype-rullegardinmeny og velgAdministrer merkevareskrifttyper.
  6. Følg trinnene i denne kunnskapsbaseartikkelen for å legge til eller redigere skrifttypene dine.

Rediger tilpassede skrifttyper

Når du har lastet opp en tilpasset skrifttype i temaredigereren, kan du laste opp flere skrifttyper, tilpasse eksisterende skrifttyper med flere skriftstiler eller slette skrifttyper.

Bruk tilpassede skrifttyper i stilark

Som et alternativ til å bruke standard webskrifttyper eller et skriftbibliotek somGoogle Fonts, kan du lagre skriftfiler i filverktøyet og deretter henvise til dem i stilarket ditt.

Merk: Tilpassedeskrifttyper er kun tilgjengelige i kontoer med tilgang til designadministratoren og må brukes med CSS. Å legge til en tilpasset skrift vilikke legge skriften til stil-rullegardinmenyene i innholdsredigereren.

For å bruke en skrift i innholdet, last opp skriftfilene til filverktøyet. Det anbefales å laste opp minst .woff-,.ttf - og .eot-versjoner av skriften for å sikre at skriften lastes inn i alle nettlesere. Du kan bruke ekspertmodus iFont Squirrels konverteringsverktøyfor å generere flere filformater.

  1. I HubSpot-kontoen din, naviger til Innhold > Filer. Hvis du bruker HubSpots gratisverktøy, navigerer du til Markedsføring > E-post. Øverst til høyre klikker du på E-postverktøy og velger Filer.
  2. Klikk påLast opp filer.
  3. Velgskriftfilene på datamaskinens harddisk, og klikk deretterpå Åpne.
  4. Klikk på navnet på en opplastet fontfil.
  5. I panelet til høyre klikker du påKopier URL for å kopiere URL-en der filen ligger. Du trenger URL-en for skrifttypen i hvert filformat.

Bruk en tilpasset skrift i et stilark

Når du har lagt til en tilpasset skrift i filverktøyet, kan du henvise til den i et stilark. Hver skriftstil (kursiv, fet skrift osv.) krever en egen @font-face-regel. Lær mer om å jobbe med stilark i HubSpot. 

  1. Gå til Innhold > Design Manager i HubSpot-kontoen din.
  2. Åpne stilarket som brukes for innholdet ditt i søkefunksjonen.
  3. For hver skriftstil: 
    • Lim inn følgende kode øverst i stilarket: 

@font-face {
font-family: 'Your Font Name';
src: url('your_font_file.eot?') format('eot'), url('your_font_file.woff') format('woff'), url('your_font_file.ttf') format('truetype');}

    • Erstatt Navnet på skrifttypen med navnet på skrifttypen.
    • Erstattyour_font_file.xxx? medURL-en fra filverktøyet. Gjenta for hvert filformat.
  1. Opprett CSS-regler med egenskapen font-family for å bruke den tilpassede skrifttypen. 
  2. Klikk på Oppdater ellerPubliser øverst til høyre for å publisere endringene. 

Bruk en tilpasset skrift i en tilpasset kodet e-postmal

Tilpassede skrifter støttes ikke i de fleste populære e-postklienter. For å sikre en konsistent opplevelse for leserne dine, anbefales det å bruke standard webskrifter i e-poster. Hvis du imidlertid ønsker å legge til en tilpasset skrift i en tilpasset kodet e-postmal, kan du gjøre det når du har lagt til den tilpassede skriften i filverktøyet.

  1. Gå til Innhold > Design Manager i HubSpot-kontoen din.
  2. I søkefeltet klikker du på navnet på den egendefinerte e-postmalen.
  3. For hver skriftstil:
    • I delen <head> i malen limer du inn denne koden mellom taggene <style>....</style>: 

@font-face {
font-family: 'Your Font Name';
src: url('your_font_file.eot?') format('eot'), url('your_font_file.woff') format('woff'), url('your_font_file.ttf') format('truetype');}

    • Erstatt Navnet på skrifttypen med navnet på skrifttypen.
    • Erstattyour_font_file.xxx? medURL-enfra filverktøyet. Gjenta for hvert filformat. 
  1. I koden for e-postteksten legger du til den tilpassede skrifttypen i innebygd styling. 
  2. Klikk på Oppdater ellerPubliser øverst til høyre for å publisere endringene dine. 

Bruk en tilpasset skrift i en CTA

Etter at du har lagt til en tilpasset skrift i temaet ditt, kan du bruke den med CTA-er.

  1. Gå til Markedsføring > CTA-er i HubSpot-kontoen din.
  2. Klikk på rullegardinmenyen øverst til venstre og velg CTA-er
  3. Hold musepekeren over en CTA, og klikk deretter på Handlinger > Rediger. 
  4. I venstre panel i CTA-redigeringsverktøyet klikker du på Design -fanen. 
  5. Klikk på Stiler-delen for å utvide den.
  6. Klikk på rullegardinmenyen Primær skrift og velg din tilpassede skrift. 
  7. Fortsett å opprette CTA-en. 

Bruk en tilpasset skrift i en CTA (

eldre

versjon)

I likhet med CTA-er kan du bruke en tilpasset skriftfil med eldre CTA-er etter at du har lastet den opp.

  1. Gå til Markedsføring > CTA-er i HubSpot-kontoen din.
  2. Hold musepekeren over en CTA, og klikk deretter på Handlinger > Rediger. 
  3. Klikk påAvanserte alternativer i panelet til høyre. 
  4. Lim inn denne koden i tekstboksen:

    font-family: 'Your Font Name';
  5. Erstatt Navnet på skrifttypen mednavnet på skrifttypen.
  6. Klikk påNeste nederst til høyre. Klikk deretter på Lagre.

Bruk en tilpasset skrift i en tilpasset modul

Når du har lagt til en tilpasset skrift i filverktøyet, kan du bruke den i tilpassede blogg- eller sidemoduler. Lær hvordan du legger til en tilpasset skrift i en tilpasset e-postmal. 

  1. Gå til Innhold > Design Manager i HubSpot-kontoen din.
  2. I søkefeltet klikker du på navnet på den tilpassede modulen.
  3. I modulredigereren, i delenmodule.css, lim inn følgende kode:

@font-face {
font-family: 'Your Font Name';
src: url('your_font_file.eot?') format('eot'), url('your_font_file.woff') format('woff'), url('your_font_file.ttf') format('truetype');}

    • Erstatt Navnet på skrifttypen med navnet på skrifttypen.
    • Erstattyour_font_file.xxx? medURL-enfra filverktøyet. Gjenta for hvert filformat.
  2. Opprett CSS-regler med egenskapen font-family for å bruke den tilpassede skrifttypen. 
  3. Klikk på Publiser endringerøverst til høyre for å publisere endringene dine. 
Var denne artikkelen nyttig?
Dette skjemaet brukes kun for tilbakemeldinger om dokumentasjon. Se hvordan du kan få hjelp med HubSpot.
Innholdsfortegnelse

Relatert innhold

New call-to-action