Bewerk uw thema-instellingen

Laatst bijgewerkt: oktober 19, 2020

Geldt voor:

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

Een thema is een set van stijlen en templates die u kunt toepassen op uw website pagina's en blogs in HubSpot. Om ervoor te zorgen dat uw website er consistent uitziet, worden de stijlinstellingen voor alle pagina's met hetzelfde thema beheerd in uw thema-instellingen. U kunt de instellingen van uw thema's eenvoudig aanpassen door te klikken op het tabblad Design aan de linkerkant in de pagina-editor. Thema-instellingen kunnen worden aangepast met intuïtieve bedieningselementen zoals schakelaars, schakelaars en kleurplukkers.

Voordat u begint

Thema-instellingen regelen de hoofdkleuren, lettertypen en knopstijlen voor pagina's met behulp van uw themasjablonen.

Let op: de stylingopties die beschikbaar zijn in uw thema-instelling zijn afhankelijk van de thema-veldopties die zijn opgenomen door de webontwikkelaar die uw thema heeft gemaakt.

Een deel van de inhoud voor uw website wordt beheerd in andere delen van uw accountinstellingen, waaronder:

  • Uw bedrijfslogo: update uw bedrijfslogo in uw Account Standaardinstellingen in het tabblad Branding.
  • Uw navigatiemenu: de menukleuren zijn ingesteld in de thema-instellingen, maar de inhoud van uw navigatiemenu en de links worden beheerd in uw navigatie-instellingen. Leer hoe u een navigatiemenu kunt maken dat u kunt toevoegen aan de globale header of globale voettekst in de pagina-editor.
  • Uw domein voor publicatie: alleCMS Hub Professionele accounts kunnen één merkdomein verbinden, en alle CMS Hub Enterprise accounts kunnen twee merkdomeinen verbinden. Alle accounts kunnen meerdere subdomeinen voor deze merkdomeinen hosten. Leer hoe u uw domein kunt verbinden in de domeinmanagertool voor het publiceren van pagina's.

Bewerk thema-instellingen

Om uw thema-instellingen te bewerken, moet u eerst een pagina met een thema-sjabloon maken. De thema-instellingen zijn toegankelijk in de pagina-editor door op detab Design aan de linkerkant te klikken. Klik vervolgens opThema-instellingen bewerken.

edit-global-themes-from-editor

Door het aanpassen van kleuren, lettertypen en spacing worden de standaardstijlen voor alle elementen op uw pagina ingesteld. Als u specifieke details wilt bewerken, zoals link kleuren, knopkleuren of standaard formulierkleuren, klik dan op Bewerken naast Meer instellingen om extra thema-instellingen te bekijken die beschikbaar zijn voor uw sjablonen.

Kleuren

De kleurinstellingen van uw thema passen een primaire, secundaire en achtergrondkleur toe op alle elementen die in uw themasjablonen zijn opgenomen. Deze stijlen worden toegepast op alle elementen op uw website. Om meer specifieke instellingen voor koppen, lettertypen en links aan te passen, klikt u op Bewerken naast Meer instellingen.

edit-global-theme-colors

Lettertypen

Kies een primair en secundair lettertype om toe te passen op de koppen, formulieren, knoppen en lichaamstekst van uw website. Alle Google-lettertypen worden ondersteund. Klik op de kleurenbel om de kleuren van uw primaire of secundaire lettertype aan te passen. U kunt een eenvoudige kleurwaarde kiezen of op het tabblad Geavanceerd klikken en een specifieke hexadecimale waarde kiezen met een kleurkiezer.

edit-global-theme-fonts

Afstand

Uw thema-instellingen voor de afstand bepalen de maximale breedte van uw pagina-inhoud en de verticale afstand tussen de verschillende elementen op uw pagina.

edit-global-theme-spacing

Meer instellingen

Binnen uw thema-instellingen heeft u mogelijk aanvullende gedetailleerde instellingen voor meer specifieke stijlen op uw pagina. De stijlopties in uw thema zijn gebaseerd op de themavelden die in het gecodeerde sjabloon van uw thema zijn opgenomen. Als u niet in staat bent om de instelling die u zoekt te vinden, reik dan naar uw sjabloonontwerper om te zien welke opties in uw sjabloon zijn opgenomen.

Het onderstaande voorbeeld is een algemene handleiding voor welke extra opties in uw thema kunnen worden opgenomen. Voor een volledige referentie van de themavelden die in uw sjabloon kunnen worden opgenomen, zie de documentatie van de ontwerper.

Let op: vergeet niet dat u lettertypes, kleuren en stijlen kunt aanpassen binnen een rijke tekstmodule op uw pagina, of door de standaardstijlen van uw thema in de pagina-editor te overschrijven. Pas deze stijlen alleen aan als u wilt dat ze worden toegepast op alle pagina's die dit thema gebruiken.

Typografie

In uw typografie-instellingen kunt u de lettertypes die van toepassing zijn op bepaalde elementen in uw sjablonen controleren. Alle Google-lettertypen worden ondersteund. U kunt ook aangepaste kleuren selecteren voor bepaalde koppen, lettertypen of links in uw thema.

  • Koppen: ukunt het exacte lettertype, de kleur, de grootte en de stijl aanpassen voor alle koppen in uw thema.
  • Lichaam:pas het lettertype, de kleur of de tekstgrootte van alleen het lichaam van uw pagina aan.
  • Links:pas de standaardkleur van links op uw website aan. U kunt ook de kleur en het gedrag van links aanpassen wanneer een bezoeker met de muis over uw link gaat of erop klikt.

Knoppen

U kunt aangepaste kleuren, lettertypen en stijlen instellen voor knoppen op uw pagina's en blog. Binnen de pagina-editor voor een specifieke pagina kunt u mogelijk de grootte of het type van de knoppen wijzigen, afhankelijk van hoe uw thema door de ontwikkelaar van uw website is gemaakt.

  • Grootte: specificeer de afmetingen van kleine, gewone en grote knoppen op uw pagina.
  • Primair: een primaire button is voor de belangrijkste actie die een bezoeker op uw pagina onderneemt. Deze kleur moet opvallen en de aandacht van uw bezoeker trekken.
  • Secundair: een secundaire button wordt gebruikt voor relatief minder belangrijke acties als er al een primaire button op uw pagina staat. Secundaire knoppen worden meestal toegepast op pagina's voor acties met een lagere prioriteit.
  • Simpel: dit zijn de standaard lettertypes en stijlen die worden toegepast op eenvoudige knopmodules in uw pagina.

Formulieren

Pas de standaardkleuren, lettertypen en tekststijlen en knoppenstijlen voor uw formulieren aan.

  • Titel: dit zijn stijlen die worden toegepast op het tekstveld dat boven uw gehele formulier verschijnt. Dit omvat meestal een begroeting en instructies voor het invullen van het formulier. Deze stijlen op uw formulier kunnen alleen hier worden beheerd in de instellingen van uw thema.
  • Labels: stijlen toegepast op de labels die boven een formulierveld verschijnen.
  • Velden: stijlen toegepast op de namen van de formuliervelden zelf.
  • Helptekst: ditis de voorbeeldinhoud die in elk formulierveld verschijnt en geeft aan wat voor soort informatie uw bezoeker moet inzenden.
  • Versturen: kies welke knopstijl en grootte op uw formulieren moet worden toegepast.
  • Achtergrondkleur: deachtergrondkleur die op uw formulier wordt toegepast.
  • Rand: derandkleur rond de formuliervelden.
  • Vulling: de hoeveelheid ruimte rond het formulier op uw pagina.

Tabellen

Stel de standaardkleuren, -lettertypen, -afstanden en -randen in voor tabellen die aan uw pagina zijn toegevoegd.

  • Tabelkop: dekleuren die worden toegepast op lettertypes in uw tabelkop, en de standaard achtergrondkleur over de volledige breedte van de eerste rij van uw tabel. U kunt ook een onderlijst instellen voor een accentkleur langs de onderkant van de tabelkop.
  • Letterkleur: standaardkleur voor lettertypes in uw tabel.
  • Achtergrondkleur:standaard achtergrondkleur voor de achtergrond van de cellen van uw tabel.
  • Rand: destandaardkleur van de rand, de breedte en de stijl van uw tabel.
  • Padding: de hoeveelheid ruimte boven en onder uw tabel op uw pagina.

Leer meer over het invoegen van een tabel in een rijke tekstmodule op uw pagina.

Website header

Deze instellingen regelen de kleuren en lettertypes die in de kop van uw pagina verschijnen, inclusief uw navigatiemenu. Leer hoe u uw navigatiemenu kunt instellen in uw accountinstellingen. Omuw bedrijfslogo in te stellen op uw themasjablonen, voegt u uw logo-afbeeldingtoe aan de standaardinstellingen van uw account in de rubriek Branding .

  • Menu:selecteer de kleur en de stijl van het lettertype voor uw navigatiemenu wanneer bezoekers een menu-item bekijken, er met de muis overheen gaan of op een menu-item klikken. Deze stijlen kunnen alleen hier worden beheerd in uw thema-instellingen.
  • Achtergrondkleur:selecteer de kleur voor de achtergrond van de header van uw website.
  • Onderste rand: indien gewenst kunt u een horizontale lijn als rand onder de kop van uw website toevoegen. Selecteer een stijl om de onderste rand te activeren en selecteer vervolgens een kleur en breedte voor uw rand.

Voetregel

Deze instellingen regelen de kleuren en lettertypen die in de voettekst van uw pagina verschijnen, inclusief eventuele navigatiemenu's. Leer hoe u uw navigatiemenukunt instellen in uw accountinstellingen.

  • Menu:selecteer de kleur en de stijl van het lettertype voor het navigatiemenu in de voettekst van uw thema. U kunt de kleuren aanpassen voor wanneer bezoekers een menuonderdeel bekijken, er met de muis overheen gaan of erop klikken. Deze stijlen kunnen alleen hier worden beheerd in de instellingen van uw thema.
  • Achtergrondkleur:selecteer de kleur voor de achtergrond van de voettekst van uw website.
  • Onderste rand: indien gewenst kunt u een horizontale lijn als rand toevoegen onder uw website footer. Selecteer een stijl om de onderste rand te activeren en selecteer vervolgens een kleur en breedte voor uw rand.

Blog

Deze instellingen bepalen de stijl van uw advertentiepaginasjabloon en blogpostsjabloon.

Bannerafbeeldingen: upload afbeeldingen om te gebruiken in de achtergrond van de header van uw blogtemplate. U kunt één afbeelding kiezen voor de homepage van uw blog, en één afbeelding om toe te passen op al uw blogberichten.

Tags: stel de standaard kleur, lettertypes en stijlen in voor uw blogtags, die bovenaan uw blogberichten verschijnen.