Doorgaan naar artikel
Let op: De Nederlandse vertaling van dit artikel is alleen bedoeld voor het gemak. De vertaling wordt automatisch gemaakt via een vertaalsoftware en is mogelijk niet proefgelezen. Daarom moet de Engelse versie van dit artikel worden beschouwd als de meest recente versie met de meest recente informatie. U kunt het hier raadplegen.
Landing Pages

Google Fonts toevoegen aan pagina's en CTA's

Laatst bijgewerkt: augustus 3, 2021

Geldt voor:

Marketing Hub Professional, Enterprise
CMS Hub Starter, Professional, Enterprise
Legacy Marketing Hub Basic

U kunt Google Font link tags toevoegen aan een of alle pagina's in uw instellingen, of in het header HTML veld. Als je CSS kunt bewerken, kun je de @import code bovenaan een specifiek CSSbestand zetten.

Let op: Als u inhoud maakt met behulp van een thema, kunt u elk Google Font direct binnen uw thema-instellingen kiezen. Alle Google Fonts worden ook ondersteund in starter templates in het Design tabblad.

Kopieer het script van uw Google Font

Kopieer eerst het script voor uw gewenste lettertype van Google Fonts.

  • Navigeer naar fonts.google.com.
  • Zoek in de zoekbalk naar de naam van het gewenste lettertype.
  • Klik op de naam van het lettertype om een volledige lijst te zien van stijlen die beschikbaar zijn om te importeren.
  • Klik op + Selecteer deze stijl naast elke stijl die u wilt importeren uit dit lettertype.
  • Selecteer in het rechterpaneel het tabblad Embed en selecteer @import.
  • Kopieer het @importscript dat door Google is geleverd, zonder de tag <style>. Je voegt dit script toe aan de bovenkant van je stylesheet in je HubSpot account.
  • Vervolgens past u deze lettertypes toe op specifieke CSS selectors op uw HubSpot stylesheet met behulp van de CSS regels om families van Google Fonts te specificeren.

import-google-fonts-to-stylesheet

Google Fonts toevoegen aan uw HubSpot pagina's

  • Pas het Google Font toe op alle gewenste CSS selectors, zoals in het voorbeeld hieronder.

h1 {
font-family: 'Comic Neue', cursief;
}

Uw Google-lettertype toevoegen aan een CTA

Je kunt een Google-lettertype toevoegen aan een aangepaste CTA in je account. Deze optie is niet beschikbaar voor een CTA met afbeelding.

  • Kopieer decodeSpecifyin CSS vanGoogle Fonts.
  • { local.navCTAs }}
  • Beweeg met de muis over de CTA die u wilt bewerken, klik vervolgens op het vervolgkeuzemenu Acties en selecteer Bewerken.
  • Klik onderaan de CTA-editor in het rechterpaneel op Geavanceerde opties.
  • Plak in het veldAangepaste CSS-tekstde code van CSS-regels om families van Google Fonts op te geven. U zult zien dat het Google-lettertype op uw CTA wordt toegepast zodra u deze CSS invoert.

  • Klik op Volgendein de rechterbenedenhoek om de details van uw CTA af te ronden. Klik dan op Opslaan om uw wijzigingen toe te passen.