- Kennisbank
- Content
- Website en landingspagina's
- Thema-instellingen bewerken
Thema-instellingen bewerken
Laatst bijgewerkt: 12 september 2025
Beschikbaar met elk van de volgende abonnementen, behalve waar vermeld:
Een thema is een verzameling stijlen en sjablonen die je kunt toepassen op je pagina's en blogberichten in HubSpot. Om ervoor te zorgen dat je webinhoud er consistent uitziet, worden stijlinstellingen voor alle pagina's en berichten die hetzelfde thema gebruiken beheerd in je thema-instellingen.
Voordat je aan de slag gaat
Voordat je met deze functie aan de slag gaat, moet je goed begrijpen welke stappen je van tevoren moet nemen, wat de beperkingen van de functie zijn en wat de mogelijke gevolgen van het gebruik ervan zijn.
Begrijp beperkingen en overwegingen
- De stylingopties die beschikbaar zijn in de thema-instellingen zijn afhankelijk van de opties voor het themaveld die zijn opgenomen door de webontwikkelaar die het thema heeft gemaakt.
- Kennisbanken gebruiken een aangepaste versie van thema's. Leer meer over het bewerken van de thema-instellingen van kennisbanken.
- Sommige elementen voor webinhoud worden beheerd in andere delen van de accountinstellingen, waaronder:
- Bedrijfslogo: werk uw bedrijfslogo bij in de Brand Kit.
- Navigatiemenu: menukleuren kunnen worden 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 kop- of voettekstinhoud in de pagina-editor.
Thema-instellingen bewerken
U kunt de instellingen van een thema bewerken vanuit de volledige thema-editor voor elke pagina of post die dat thema gebruikt. U kunt de thema-instellingen voor website- en landingspagina's ook bewerken in de inhoudseditor als een superbeheerder de account heeft aangemeld voor de universele thema-editor (BETA).
-
Navigeer naar uw inhoud:
- Website Pagina's: Ga in je HubSpot-account naar Inhoud > Websitepagina's.
- Landingspagina's: Ga in je HubSpot-account naar Inhoud > Landingspagina's.
- Blog: Ga in je HubSpot-account naar Inhoud > Blog.
- Klik op de naam van uw inhoud.
- De volledige thema-editor gebruiken voor pagina's en berichten:
- Klik in de inhoudseditor op het menu Bewerken en selecteer Thema in de werkbalk van de editor. Als u bijvoorbeeld het thema Elevate gebruikt, klikt u op het menu Bewerken en selecteert u Thema: Elevate.
-
- Klik in de thema-editor om de relevante secties (bijvoorbeeld Kleuren of Knoppen) uit te vouwen om de thema-instellingen te bewerken.
- Als je klaar bent, klik je op Thema publiceren. U wordt teruggeleid naar de inhoudseditor.
- De universele thema-editor (BETA) gebruiken voor pagina's:
- Klik in de inhoudseditor voor pagina's op het pictogram Globale themastijlen in de linkerzijbalk.
- Klik in de linkerzijbalk om de relevante secties uit te vouwen (bijvoorbeeld Kleuren of Knoppen) om de thema-instellingen te bewerken. Wijzigingen zijn van toepassing op alle pagina's en sjablonen die het thema gebruiken.
Thema stijlen begrijpen
Binnen je thema-instellingen kan je stijlopties hebben voor lettertypes, kleuren, knoppen en links. Je kunt ook extra gedetailleerde instellingen hebben voor meer specifieke stijlen op je pagina. De stijlopties in je thema zijn gebaseerd op de themavelden in het gecodeerde sjabloon van je thema. Als je de instelling die je zoekt niet kunt vinden, neem dan contact op met de ontwerper van je sjabloon om te zien welke opties zijn opgenomen in je sjabloon.
De onderstaande voorbeelden zijn een algemene richtlijn voor welke typen stijlopties kunnen zijn opgenomen in uw thema. Raadpleeg de documentatie van de ontwerper voor een volledige referentie van themavelden die kunnen worden opgenomen in uw sjablonen.
Let op: je kunt lettertypen, kleuren en stijlen aanpassen binnen een rich text module op je pagina, of door de standaard stijlen van je thema te overschrijven binnen de pagina-editor. Pas deze stijlen alleen aan als je wilt dat ze worden toegepast op alle pagina's die dit thema gebruiken.
Kleuren
De kleurinstellingen van je thema passen een primaire, secundaire en achtergrondkleur toe op alle elementen in je themasjablonen. Deze stijlen worden toegepast op alle elementen op je website.
Lettertypen
Kies een primair en secundair lettertype voor de koppen, formulieren, knoppen en tekst op je website. Alle Google-lettertypen worden ondersteund. Klik op de kleurwolk om de kleuren van je primaire of secundaire lettertype aan te passen. Je kunt een eenvoudige kleurwaarde kiezen of op het tabblad Geavanceerd klikken en een specifieke hexadecimale waarde kiezen met een kleurenkiezer.
Spatie
Je thema-instellingen voor spatiëring bepalen de maximale breedte van de inhoud van je pagina of post en de verticale spatiëring tussen verschillende elementen.
Typografie
In de instellingen voor typografie kun je bepalen welke lettertypen van toepassing zijn op bepaalde elementen in je sjablonen. Alle Google lettertypes worden ondersteund. Je kunt ook aangepaste kleuren selecteren voor bepaalde koppen, lettertypes of links in je thema.
- Koppen: u kunt het exacte lettertype, de kleur, de grootte en de stijl aanpassen voor alle koppen in uw thema.
- Body: pas alleen het lettertype, de kleur of de tekstgrootte van de body van je pagina aan.
- Links: pas de standaardkleur van links op je website aan. Je kunt ook de kleur en het gedrag van links aanpassen wanneer een bezoeker met de muis over je 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 knoppen wijzigen, afhankelijk van hoe uw thema is gemaakt door uw websiteontwikkelaar.
- Grootte: geef de afmetingen op van kleine, normale en grote knoppen op uw pagina.
- Primair: een primaire knop is voor de belangrijkste actie die een bezoeker op je pagina uitvoert. Deze kleur moet opvallen en de aandacht van je bezoeker trekken.
- Secundair: een secundaire knop wordt gebruikt voor relatief minder belangrijke acties als er al een primaire knop op je pagina staat. Secundaire knoppen worden meestal toegepast op pagina's voor acties met een lagere prioriteit.
- Eenvoudig: dit zijn de standaardlettertypen en -stijlen die worden toegepast op eenvoudige knopmodules op je pagina.
Formulieren
Pas de standaardkleuren, lettertypen, tekststijlen en knopstijlen voor uw formulieren aan.
- Titel: dit zijn stijlen die worden toegepast op het tekstveld dat boven je hele formulier verschijnt. Dit bevat meestal een begroeting en instructies voor het invullen van het formulier. Deze stijlen op je formulier kunnen alleen hier worden beheerd in de instellingen van je thema.
- Labels: stijlen die worden toegepast op de labels die boven een formulierveld verschijnen.
- Velden: stijlen toegepast op de namen van de formuliervelden zelf.
- Help-tekst: dit is de voorbeeldinhoud die in elk formulierveld verschijnt en die aangeeft welk type informatie uw bezoeker moet verzenden.
- Indienen: kies welke knopstijl en -grootte moet worden toegepast op uw formulieren.
- Achtergrondkleur: de achtergrondkleur van je formulier.
- Rand: de randkleur rond de formuliervelden.
- Padding: de hoeveelheid ruimte rond het formulier op je pagina.
Tabellen
Stel de standaardkleuren, lettertypen, spatiëring en randen in voor tabellen die je aan je pagina toevoegt. Meer informatie over het invoegen van een tabel in een rijke tekstmodule op je pagina.
- Tabelkop: de kleuren die worden toegepast op lettertypen in je tabelkop en de standaard achtergrondkleur over de volledige breedte van de eerste rij van je tabel. Je kunt ook een onderrand instellen voor een accentkleur langs de onderkant van de tabelkop.
- Letterkleur: standaardkleur voor lettertypen in je tabel.
- Achtergrondkleur: standaard achtergrondkleur voor de achtergrond van de cellen in je tabel.
- Rand: de standaard randkleur, breedte en stijl van je tabel.
- Padding: de hoeveelheid ruimte boven en onder je tabel op je pagina.
Website koptekst
Deze instellingen bepalen de kleuren en lettertypes die in de header van je pagina verschijnen, inclusief je navigatiemenu. Lees hoe u uw navigatiemenu instelt in uw accountinstellingen . Als u uw bedrijfslogo wilt instellen op uw themasjablonen, voegt u uw logo-afbeelding toe aan de standaardinstellingen van uw account in het gedeelteBranding.
- Menu: selecteer de kleur en stijl van het lettertype voor je navigatiemenu wanneer bezoekers een menu-item bekijken, erover zweven of erop klikken. Deze stijlen kunnen alleen hier worden beheerd in je thema-instellingen.
- Achtergrondkleur: selecteer de kleur voor de achtergrond van de header van je website.
- Onderrand: indien gewenst kunt u een horizontale lijn toevoegen als rand onder de header van uw website. Selecteer een stijl om de onderste rand te activeren en selecteer vervolgens een kleur en breedte voor uw rand.
Voettekst
Met deze instellingen bepaal je de kleuren en lettertypen die worden weergegeven in de voettekst van je pagina, inclusief navigatiemenu's. Leer hoe je je navigatiemenu instelt in je accountinstellingen.
- Menu: selecteer de kleur en stijl van het lettertype voor het navigatiemenu in de voettekst van je thema. Je kunt de kleuren aanpassen voor wanneer bezoekers een menu-item bekijken, erover zweven of erop klikken. Deze stijlen kunnen alleen hier worden beheerd in de instellingen van je thema.
- Achtergrondkleur: selecteer de kleur voor de achtergrond van de voettekst van uw website.
- Onderrand: indien gewenst kunt u een horizontale lijn toevoegen als rand onder de voettekst van uw website. 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 het sjabloon van uw listingpagina en blogpostsjabloon.
- Bannerafbeeldingen: upload afbeeldingen om te gebruiken in de achtergrond van de header van uw blogtemplate. Je kunt één afbeelding kiezen voor de homepage van je blog en één afbeelding voor al je blogberichten.
- Tags: stel de standaardkleur, lettertypes en stijlen in voor uw blogtags, die bovenaan uw blogberichten verschijnen.