Wanneer de instelling 'Highlight Matching Search Keywords in Articles' is ingeschakeld, markeert Document360 automatisch de zoekterm waar deze ook in een artikel voorkomt. De standaard highlightkleur is geel. Je kunt dit bijvoorbeeld overschrijven met een aangepaste kleur om bij je merkpalet te passen of het contrast te verbeteren, zowel voor de lichte als donkere modi.
Wanneer dit te gebruiken
Gebruik deze aanpassing wanneer je wilt:
- Vervang de standaard gele highlight door een kleur die past bij je merk of sitethema.
- Verbeter de zichtbaarheid van zoektermmarkeringen ten opzichte van de achtergrondkleur van je kennisbasis.
- Pas consistente highlightstyling toe in zowel lichte als donkere modi.
Voordat je begint
- De instelling 'Highlight Matching Search Keywords in Articles' moet ingeschakeld zijn om überhaupt zoekmarkeringen te laten verschijnen. Schakel het in onder Instellingen () > kennisbanksite > site-aanpassing voordat je deze CSS toepast.
- Je hebt toegang nodig tot Instellingen () > Kennisbanksite > Site-aanpassing > Aangepaste CSS & JavaScript in het kennisbankportaal.
Hoe verander je de kleur van de zoekwoordmarkering
-
Navigeer naar Instellingen (
) > Kennisbanksite > Site-aanpassing > Custom CSS & JavaScript in het kennisbankportaal.
-
Selecteer in het linker navigatiepaneel het tabblad CSS en plak het volgende fragment:
.fp-search-content em, .search-content em {
background-color: #4E1E66;
color: white;
}
In de voorbeeldfragmenten hierboven worden groen en paars gebruikt als voorbeeldkleuren met witte tekst. Vervang deze door de gewenste kleurwaarden.
-
Werk de
background-coloren-waardencolorbij naar de gewenste kleuren. -
Klik op Opslaan.

Uitkomst
Voorheen
Zoekwoorden worden gemarkeerd met de standaard gele kleur die door Document360 wordt aangeboden.

Na
Zoekwoorden worden gemarkeerd met de aangepaste achtergrondkleur #4E1E66 en witte tekst na het toepassen van de CSS.

Best practices
- Kies een highlightkleur die contrasteert met zowel je paginaachtergrond als je tekst. Een hooglichtkleur die opgaat in de achtergrond is onzichtbaar; Een die botst met de tekstkleur vermindert de leesbaarheid. Test je gekozen combinatie in zowel Licht- als Donkermodus.
- Houd de tekstkleur (
color) synchroon met de achtergrond van je highlights. Het fragment stelt zowel de achtergrond van de markering (background-color) als de tekstkleur (color) in binnen de markering. Als je de achtergrond verandert naar een donkere kleur, gebruikwhitehet dan voor de tekst. Als je een lichte achtergrond gebruikt, gebruik dan een donkere tekstkleur. - Gebruik HEX- of RGB-waarden in plaats van kleurnamen. CSS-kleurnamen zoals
greenzijn onnauwkeurig. Vervang ze door je specifieke HEX-code voor nauwkeurige en brandconsistente resultaten. - Controleer of de instelling Highlight Matching Search Keyword is ingeschakeld. Als de highlights niet verschijnen na het toepassen van de CSS, controleer dan of de functie is ingeschakeld. De CSS-wijziging beïnvloedt alleen de kleur — het kan de functie zelf niet activeren.