Wenn die Einstellung "Suchbegriffe in Artikeln hervorheben " aktiviert ist, hebt Document360 den Suchbegriff automatisch überall dort hervor, wo er in einem Artikel erscheint. Die Standardfarbe der Highlights ist gelb. Sie können dies zum Beispiel mit einer eigenen Farbe übersteuern, um Ihre Markenpalette zu ergänzen oder den Kontrast zu verbessern, sowohl im Hellen als auch im Dunkelmodus.
Wann sollte man das verwenden
Nutzen Sie diese Anpassung, wenn Sie möchten:
- Ersetzen Sie das Standard-Gelbe durch eine Farbe, die zu Ihrer Marke oder Ihrem Seitenthementhema passt.
- Verbessern Sie die Sichtbarkeit von Suchbegriffs-Highlights im Vergleich zur Hintergrundfarbe Ihrer Wissensbasis.
- Wenden Sie sowohl im Hell- als auch im Dunkelmodus konsequentes Highlight-Styling an.
Bevor du anfängst
- Die Einstellung "Suchbegriffe in Artikeln" muss aktiviert sein, damit Such-Highlights überhaupt angezeigt werden. Aktiviere es unter Einstellungen () > Knowledge Base-Seite > Site-Anpassung vor der Anwendung dieses CSS.
- Du brauchst Zugriff auf die Einstellungen () > Wissensdatenbank-Seite > Site-Anpassung > benutzerdefiniertes CSS und JavaScript im Knowledge Base-Portal.
Wie man die Farbe des Suchstichwort-Highlights ändert
-
Navigiere zu den Einstellungen (
) > Knowledge Base-Seite > Site-Anpassung > benutzerdefiniertes CSS und JavaScript im Knowledge Base-Portal.
-
Wählen Sie im linken Navigationsfenster den CSS-Tab aus und fügen Sie folgenden Ausschnitt ein:
.fp-search-content em, .search-content em {
background-color: #4E1E66;
color: white;
}
In den obigen Beispielausschnitten werden Grün und Lila als Beispiel-Highlightfarben mit weißem Text verwendet. Ersetzen Sie diese durch Ihre gewünschten Farbwerte.
-
Aktualisieren Sie die
background-colorWertecolorauf Ihre gewünschten Farben. -
Klicken Sie auf Speichern.

Ergebnis
Vorher
Suchbegriffe werden mit der von Document360 bereitgestellten Standardgelbfarbe hervorgehoben.

Danach
Suchbegriffe werden nach der Anwendung des CSS mit der benutzerdefinierten Hintergrundfarbe #4E1E66 und weißem Text hervorgehoben.

Best Practices
- Wählen Sie eine Highlight-Farbe, die sowohl zum Hintergrund Ihrer Seite als auch zu Ihrem Text kontrastiert. Eine Lichterfarbe, die mit dem Hintergrund übergeht, ist unsichtbar; einer, der mit der Textfarbe kollidiert, verringert die Lesbarkeit. Teste deine gewählte Kombination sowohl im Hellen als auch im Dunkelmodus.
- Halte die Textfarbe (
color) synchron mit deinem Highlight-Hintergrund. Der Ausschnitt legt sowohl den Hintergrund (background-color) als auch die Textfarbe (color) im Highlight fest. Wenn du den Hintergrund auf eine dunkle Farbe änderst, verwendewhitees für den Text. Wenn du einen hellen Hintergrund verwendest, verwende eine dunkle Textfarbe. - Verwenden Sie HEX- oder RGB-Werte statt Farbnamen. CSS-Farbnamen wie
greensind ungenau. Ersetze sie durch deinen spezifischen HEX-Code für genaue und markenkonsistente Ergebnisse. - Überprüfen Sie, ob die Einstellung "Suchwörter hervorheben" aktiviert ist. Wenn nach der Anwendung des CSS keine Highlights angezeigt werden, prüfen Sie, ob die Funktion aktiviert ist. Die CSS-Änderung wirkt sich nur auf die Farbe aus – sie kann die Funktion selbst nicht aktivieren.