Naar de inhoud

Het uiterlijk van je documentatie aanpassen (thema's, kleuren en lettertypes)

Je kunt het uiterlijk van je gepubliceerde documentatie aanpassen zodat deze aansluit bij je merkidentiteit. Deze instellingen vind je in de Projectinstellingen onder het tabblad Publiceren > Thema's & Kleuren. Hiermee kun je het thema, de kleuren, de lettertypes en andere stijlelementen bepalen die je bezoekers te zien krijgen.

Een themamodus kiezen

De instelling Standaard themamodus bepaalt hoe je documentatie er in eerste instantie uitziet voor bezoekers. Je kunt een specifiek thema kiezen of het laten aanpassen aan de systeeminstellingen van de gebruiker.

  • Auto (Volg systeemvoorkeur): Dit is de standaardoptie. De documentatie schakelt automatisch tussen een licht en donker thema, op basis van de voorkeur van het besturingssysteem van de bezoeker.
  • Licht: Je documentatie wordt altijd in het lichte thema weergegeven, ongeacht de systeeminstellingen van de gebruiker.
  • Donker: Je documentatie wordt altijd in het donkere thema weergegeven.
Documentation image

Logo-configuratie

Je kunt voor zowel het lichte als het donkere thema afzonderlijke logo's uploaden. Zo zorg je ervoor dat ze altijd goed zichtbaar zijn en passen bij je huisstijl. Als er geen logo is geüpload, wordt de door jou opgegeven tekst weergegeven.

  • Logo voor licht thema: Upload een logo dat het best tot zijn recht komt op een lichte achtergrond.
  • Logo voor donker thema: Upload een logo dat is ontworpen voor een donkere achtergrond.
  • Logo-tekst voor licht/donker thema: Voer je merknaam of andere tekst in die moet worden weergegeven als het bijbehorende logo niet beschikbaar is.
Documentation image

Kleuren aanpassen

Definieer het kleurenpalet van je merk door primaire en secundaire kleuren in te stellen voor zowel het lichte als het donkere thema. Dit zorgt voor een consistente merkervaring in verschillende weergavemodi.

  • Primaire kleur: Dit is de belangrijkste accentkleur voor interactieve elementen zoals knoppen, links en highlights.
  • Secundaire kleur: Deze kleur wordt gebruikt voor ondersteunende elementen en zorgt voor een subtiel contrast.
Documentation image

Lettertype- en stijlinstellingen

Verfijn het uiterlijk van je documentatie verder door lettertypes te selecteren en de hoekafronding van UI-elementen aan te passen.

  • Primair lettertype: Kies uit de lijst het hoofdlettertype voor alle koppen, platte tekst en algemene UI-elementen.
  • Monospace lettertype: Selecteer een lettertype specifiek voor codeblokken en inline codefragmenten.
  • Hoekstijl: Pas de randradius van UI-elementen aan. Opties zijn Scherp (0px), Afgerond (4px) en Extra afgerond (8px).
Documentation image

Tips voor aanpassingen

Vergeet niet je wijzigingen op te slaan en vervolgens op de knop Wijzigingen publiceren bovenaan de instellingen te klikken om je updates live te zetten. Gebruik voor een betere leesbaarheid altijd kleurcombinaties met een hoog contrast, zeker voor tekst en interactieve elementen.

Samenvatting

Dit artikel beschrijft hoe je het visuele uiterlijk van je gepubliceerde Hinto-documentatiesite aanpast. Het behandelt het kiezen van een standaard themamodus, het uploaden van aangepaste logo's voor lichte en donkere achtergronden, het definiëren van primaire en secundaire merkkleuren en het kiezen van lettertypes om een verzorgde, professionele uitstraling te creëren die past bij je merk.

Gerelateerd