--- title: "Hoe verander je de kleur van Feedback-knoppen" slug: "how-to-change-the-color-of-feedback-buttons" tags: ["Knowledge base design", "Customization"] updated: 2026-06-22T09:03:37Z published: 2026-06-22T09:03:37Z canonical: "docs.document360.com/how-to-change-the-color-of-feedback-buttons" --- > ## Documentation Index > Fetch the complete documentation index at: https://docs.document360.com/llms.txt > Use this file to discover all available pages before exploring further. # Hoe verander je de kleur van Feedback-knoppen De Ja- en Nee-feedbackknoppen onderaan elk artikel lijken standaard grijs wanneer lezers er niet overheen zweven. Deze lage contrast-standaard maakt de knoppen moeilijker op te vallen, waardoor de kans kleiner wordt dat lezers ermee omgaan. Je kunt de standaardknoppen overschrijven met een CSS-snippet om ze zichtbaarder te maken, je merkkleuren te laten overeenkomen of een duidelijker visueel onderscheid te maken tussen de positieve en negatieve feedbackopties. --- ## Wanneer dit te gebruiken Gebruik deze aanpassing wanneer je wilt: - Maak feedbackknoppen prominenter zodat lezers er eerder mee zullen interacteren. - Pas merkkleuren toe op de Ja- en Nee-knoppen om een consistente visuele ervaring te creëren. - Onderscheid de Ja- en Nee-knoppen met verschillende kleuren, bijvoorbeeld groen voor Ja en rood voor Nee, om hun betekenis in één oogopslag te versterken. --- ## Voordat je begint - Je hebt toegang nodig tot **Instellingen** ( ) > **Kennisbanksite** > **Site-aanpassing** > **Custom CSS & JavaScript** in het kennisbankportaal. - Zorg dat je gewenste HEX-kleurcodes klaar is voordat je begint. Het standaardfragment gebruikt `#5ebf83` (groen) voor Ja en `#e67367` (rood/oranje) voor Nee. --- ## Hoe de kleur van de standaard feedbackknop te wijzigen 1. Navigeer naar **Instellingen** ( ) > **Kennisbanksite** > **Site-aanpassing** > **Aangepaste CSS & JavaScript** in het kennisbankportaal. ![Custom CSS and JavaScript settings panel in the Document360 Knowledge base portal](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Custom%20css%20&%20js.png) 2. Selecteer in het linker navigatiepaneel het **tabblad CSS** en plak het volgende fragment: ``` .article-feedback-action{  button[aria-label="Yes"]{    background-color: #5ebf83;    color: white;  }  button[aria-label="No"]{    background-color: #e67367;    color: white;  } } ``` 1. Werk de kleurcodes bij naar de gewenste waarden. 2. Klik **op Opslaan**. ![CSS tab showing the feedback button color snippet saved in the Custom CSS and JavaScript panel](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/image-1767002457678.png) --- ## Uitkomst **Voorheen** De feedbackknoppen lijken grijs wanneer lezers er niet overheen zweven, waardoor ze gemakkelijk te missen zijn. ![Feedback buttons showing the default grey color before applying the CSS](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/2_Screenshot-Color_of_feedback_button_before_applying_CSS.png) **Na** Na het toepassen van de CSS worden de feedbackknoppen altijd weergegeven in de opgegeven kleuren, niet alleen tijdens het hoveren. ![Feedback buttons showing custom green and red colors after applying the CSS](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/3_Screenshot-Color_of_feedback_button_after_applying_CSS.png) --- ## Best practices - **Houd Ja en Nee visueel verschillend.** Lezers verwerken kleursemantiek snel. Groen gebruiken voor Ja en rood of oranje voor Nee volgt de gevestigde conventie en vermindert de cognitieve inspanning. Vermijd het gebruik van vergelijkbare kleuren voor beide knoppen. - **Controleer het contrast met de achtergrond van je pagina.** De knoppenkleuren die je kiest moeten leesbaar zijn tegen zowel lichte als donkere achtergronden. Gebruik een contrastchecker om te controleren of je keuzes voldoen aan de WCAG AA-normen (minimaal 3:1 voor UI-componenten). - **Test na het opslaan.** Open een artikel op je kennisbanksite en bevestig of de knoppen in de juiste kleuren worden weergegeven, zowel in hun standaardstaat als bij het hoveren.