Eigen CSS gebruiken (Geavanceerd)

✨ Dit artikel is gemaakt met behulp van AI. Klopt er iets niet? Laat het ons weten via de chat.

Je kunt de kleuren en de stijl van je openbare pagina's aanpassen: je betaalpagina's, cursuspagina's, winkel en studentenportaal. Dat doe je op één plek, voor je hele shop tegelijk. In dit artikel lees je hoe dat werkt en hoe je voorkomt dat je eigen CSS per ongeluk wordt vervangen.

Belangrijk om te weten: je shop heeft één stijl. Je kiest tussen Eenvoudig (twee kleuren) en Geavanceerd (je eigen CSS). Je kunt ze niet allebei tegelijk gebruiken. Heb je eigen CSS opgeslagen en kies je daarna Eenvoudig? Dan vraagt Kennis.shop eerst of je je eigen CSS wil vervangen door de twee gekozen kleuren. Zonder jouw akkoord blijft je CSS gewoon staan.

Waar stel je de stijl in?

1. Klik in het menu links op Instellingen.

2. Klik in de lijst links op Bedrijfsgegevens. Meestal staat deze pagina al open.

3. Scroll naar beneden naar het blok Huisstijl. Daarin vind je je logo, je favicon en Aangepaste stijl.

Kleuren kiezen met Eenvoudig

1. Kies bij Stijlmodus voor Eenvoudig.
2. Kies je Primaire kleur. Dit is de hoofdkleur van je pagina's.
3. Kies je Achtergrondkleur.
4. Klik op Opslaan.

Laat je beide kleuren leeg en klik je op Opslaan? Dan zie je de standaardkleuren van Kennis.shop.

Wil je alleen andere kleuren? Dan is Eenvoudig genoeg, en ook de beste keuze.

Je eigen CSS gebruiken met Geavanceerd

Ken je CSS, of laat je dit doen door een webbouwer? Dan kun je de stijl zelf bepalen.

1. Kies bij Stijlmodus voor Geavanceerd.
2. Plak of typ je CSS in het tekstvak.
3. Zet je CSS tussen <style> en </style>. Kennis.shop zet jouw tekst precies zo op je pagina's. Zonder deze twee regels werkt je CSS niet, en kan de tekst zelfs zichtbaar op je pagina komen.
4. Klik op Opslaan.

Je CSS geldt voor al je openbare pagina's, ook voor je betaalpagina's. Bekijk daarna een paar pagina's om te zien of alles goed staat.

Je eigen CSS wint altijd van de standaardkleuren van Kennis.shop, ook op je betaalpagina. Wil je de hoofdkleur of de achtergrond van je pagina's aanpassen? Zet dan deze variabelen in je CSS (je ziet ze ook onder het tekstvak, bij Beschikbare CSS variabelen):

• --tenant-primary-color: de primaire kleur.
• --tenant-background-color: de achtergrondkleur.

Waarom zijn mijn aanpassingen ineens weg?

Er zijn twee mogelijke oorzaken:

• Iemand heeft Eenvoudig gekozen, het vinkje Ja, vervang mijn eigen CSS door deze twee kleuren aangezet en op Opslaan geklikt. Dan wordt je eigen CSS vervangen door de twee kleuren.
• Je CSS is gericht op een bepaald onderdeel van een pagina, en dat onderdeel is na een update van Kennis.shop anders opgebouwd. Je CSS staat dan nog steeds in het tekstvak, maar past niet meer op dat onderdeel.

Alleen je logo of favicon wijzigen en op Opslaan klikken vervangt je eigen CSS niet.

Kies je Eenvoudig terwijl je eigen CSS is opgeslagen, dan zie je dit oranje bericht. Zolang het vinkje uit staat, wordt er niets vervangen.

Zo voorkom je het:

1. Bewaar je eigen CSS altijd ook in een eigen document, buiten Kennis.shop.
2. Zie je de oranje waarschuwing en wil je je eigen CSS houden? Laat het vinkje dan uit en kies weer Geavanceerd.
3. Past een collega ook de instellingen aan? Spreek dan af wie het blok Huisstijl mag wijzigen.

Is je CSS toch weg? Kies Geavanceerd, plak je bewaarde CSS opnieuw in het tekstvak en klik op Opslaan.

Veelgestelde vragen

We hebben de CSS voor de betaalpagina aangepast, maar na een update van Kennis.shop is die weer overschreven. Hoe kan dat?
Bij een update veranderen wij je opgeslagen CSS niet. Je CSS wordt alleen vervangen als iemand bij Eenvoudig het vinkje Ja, vervang mijn eigen CSS door deze twee kleuren aanzet en op Opslaan klikt. Wel kan een update de opbouw van een pagina veranderen. CSS die op een bepaald onderdeel van de pagina is gericht, past dan soms niet meer. Dan staat je CSS nog wel in het tekstvak, maar zie je het effect niet meer. Kijk samen met je webbouwer wat er aangepast moet worden. Is je CSS echt verdwenen? Plak dan je bewaarde CSS terug.

Waar stel ik de kleuren van mijn leeromgeving en betaalpagina in?
Bij Instellingen > Bedrijfsgegevens > Huisstijl > Aangepaste stijl. Deze stijl geldt voor al je openbare pagina's tegelijk: je betaalpagina's, cursuspagina's, winkel en studentenportaal.

Mijn kleuren waren ineens weg. Wat nu?
Kijk eerst of Stijlmodus op Eenvoudig of op Geavanceerd staat, en of de velden gevuld zijn. Iemand kan bij Eenvoudig je eigen CSS hebben vervangen. Gebruik je Eenvoudig? Kies je kleuren opnieuw en klik op Opslaan. Gebruik je eigen CSS? Kies Geavanceerd, plak je bewaarde CSS terug en klik op Opslaan.

Kan ik Eenvoudig en Geavanceerd combineren?
Nee. Je gebruikt altijd één van de twee.

Kan ik een andere stijl voor één betaalpagina maken?
Nee. De stijl geldt voor je hele shop.

Klaar! Je huisstijl staat goed en je weet hoe je voorkomt dat je CSS wordt overschreven. 🚀

Bijgewerkt op: 14/10/2026