Helpcenter Branding & Aanpassing
Pas het uiterlijk van je Bugalou Helpcenter aan. Stel merkkleuren in, upload logo's, voeg aangepaste CSS toe en configureer branding per domein.
Overzicht
De Branding-pagina laat je het uiterlijk van je Helpcenter aanpassen zodat het overeenkomt met de merkidentiteit van je bedrijf. Elk domein kan zijn eigen unieke branding hebben.
Vereiste
Je hebt minimaal één geconfigureerd domein nodig voordat je branding kunt bewerken. Als er geen domeinen bestaan, zie je een bericht: "Nog geen domeinen geconfigureerd" met een link naar de Domeininstellingen-pagina.
Branding Openen
Navigeer naar Helpcenter → Branding vanuit de zijbalk.
Een Domein Selecteren
Als je meerdere domeinen hebt, gebruik dan de domeinselectie-dropdown bovenaan de pagina om te kiezen welk domein je wilt bewerken. Branding wordt per domein opgeslagen, dus elk domein kan er anders uitzien.
Brandinginstellingen
Het brandingformulier is georganiseerd in drie secties:
1. Kleuren
Stel vijf kleurwaarden in met de kleurenkiezer of door hex-codes direct te typen:
| Kleur | Doel |
|---|---|
| Primaire Kleur | Hoofdkleur van je merk — gebruikt voor headers, knoppen en accenten |
| Secundaire Kleur | Ondersteunende kleur — gebruikt voor achtergronden en secundaire elementen |
| Accentkleur | Markeerkleur — gebruikt voor links, call-to-action elementen en hover-effecten |
| Tekstkleur | Hoofdtekstkleur — gebruikt voor bodytekst en koppen |
| Lichte Tekstkleur | Lichtere tekstkleur — gebruikt voor beschrijvingen, bijschriften en secundaire tekst |
Elk kleurveld heeft een visuele kleurvoorbeeld naast de hex-invoer, zodat je de gekozen kleur direct kunt zien.
2. Afbeeldingen
| Veld | Beschrijving |
|---|---|
| Logo URL | Plak een URL naar je bedrijfslogo. Dit verschijnt in de header van je Helpcenter. Gebruik een gehoste afbeeldings-URL (bijv. van Cloudinary, AWS S3 of je website). |
| Favicon URL | Plak een URL naar je favicon. Dit verschijnt in het browsertabblad wanneer bezoekers je Helpcenter bekijken. |
3. Content
| Veld | Beschrijving |
|---|---|
| Footertekst | Aangepaste tekst weergegeven in de footer van je Helpcenter. Bijvoorbeeld: "© 2026 Jouw Bedrijf. Alle rechten voorbehouden." |
| Aangepaste CSS | Geavanceerd: voeg aangepaste CSS-regels toe om het uiterlijk verder aan te passen buiten de basiskleuren. Gebruik standaard CSS-syntax. |
Branding Opslaan
- Vul je gewenste instellingen in
- Klik op "Branding Opslaan" (blauwe knop)
- Een groen succesbericht verschijnt: "Branding succesvol bijgewerkt!"
- Wijzigingen worden direct toegepast op je Helpcenter
Het succesbericht verdwijnt automatisch na 3 seconden.
Aangepaste CSS Tips
Het Aangepaste CSS-veld accepteert standaard CSS. Enkele voorbeelden:
- Lettertypes wijzigen:
body { font-family: 'Inter', sans-serif; } - Afstand aanpassen:
.article-content { padding: 2rem; } - Elementen verbergen:
.footer-links { display: none; } - Aangepaste hover-effecten:
a:hover { text-decoration: underline; }
Best Practices
- Gebruik je exacte merkkleuren voor een consistente klantervaring
- Host logo's en favicons op een betrouwbare CDN voor snel laden
- Gebruik logo's met transparante achtergronden (PNG of SVG) voor het beste resultaat
- Houd footertekst beknopt — copyrightmelding en bedrijfsnaam zijn voldoende
- Test Aangepaste CSS-wijzigingen eerst op een stagingdomein indien mogelijk
- Onthoud dat branding per domein is — configureer elk domein apart indien nodig