Helplinki to kontekstowa pomoc w Twojej aplikacji: mała ikonka ? obok pola czy przycisku, która po kliknięciu pokazuje dymek z podpowiedzią i linkiem do bazy wiedzy.
Jak włączyć helplinki w aplikacji
- Przejdź do Baza wiedzy → Helplinki i otwórz wybrany helplink.
- Skopiuj Skrypt wspólny i wklej go raz, w layoucie swojej aplikacji (najlepiej przed
</body>). - Skopiuj Skrypt helplinka i wklej go w kodzie HTML dokładnie tam, gdzie ma się pojawić ikonka pomocy:
<span data-helplink="twoj-klucz"></span>
Ikonka sama dopasowuje kolor do tła (jasna na ciemnym menu, ciemna na jasnym).
Ciemne dymki (dark theme)
Dymki mogą mieć ciemne tło i jasną czcionkę - np. w mobilnej wersji aplikacji.
Dla wszystkich helplinków - w skrypcie wspólnym dodaj wewnątrz var HelplinksWidget linię:
tooltip_theme: "dark",
Dla pojedynczego helplinka - dodaj atrybut do tagu:
<span data-helplink="twoj-klucz" data-helplink-tooltip="dark"></span>
Własne kolory (zaawansowane)
Wygląd widgetu można dostroić w CSS swojej aplikacji przez zmienne:
.moj-kontener {
--intum-hl-color: #64748b; /* kolor ikonki */
--intum-hl-hover-color: #1d4ed8; /* kolor ikonki po najechaniu */
--intum-hl-tooltip-bg: #1f2937; /* tło dymka */
--intum-hl-tooltip-color: #f3f4f6; /* kolor tekstu w dymku */
}
Wskazówki
- Treść helplinka z osadzonym filmem (iframe, np. YouTube) automatycznie dostaje szerszy dymek.
- Nieaktywne helplinki widzą tylko administratorzy (pomarańczowa ikonka) - mogą je od razu uzupełnić.