Локальный DataLens предоставляет базовые возможности изменения интерфейса, а также позволяет углублённую настройку через пересборку контейнеров. Возможны 3 уровня кастомизации:
Самый безопасный способ изменить внешний вид и поведение интерфейса — указать переменные окружения в контейнере datalens-ui.
| Переменная | Назначение |
|---|---|
| UI_CUSTOM_BRAND_NAME | Отображаемое название вместо Yandex DataLens |
| UI_CUSTOM_FAVICON_URL | Ссылка на favicon (иконка сайта) |
| UI_CUSTOM_LOGO_URL | Ссылка на логотип вместо стандартного логотипа Yandex |
| UI_SUPPORT_LINK_URL | Ссылка на документацию или внутреннюю техподдержку |
| UI_HIDE_YANDEX_SUPPORT_LINK | Убрать ссылку на yandex.tech (по умолчанию false) |
Пример конфигурации docker-compose.yaml:
ui:
image: ghcr.io/datalens-tech/datalens-ui:0.3049.0
container_name: datalens-ui
environment:
- UI_CUSTOM_BRAND_NAME=My Company BI
- UI_CUSTOM_LOGO_URL=https://example.com/logo.svg
- UI_CUSTOM_FAVICON_URL=https://example.com/favicon.ico
- UI_SUPPORT_LINK_URL=https://confluence.mycompany.com/datalens
- UI_HIDE_YANDEX_SUPPORT_LINK=true
ports:
- "8081:8080"
После внесения изменений нужно перезапустить контейнер:
docker compose restart ui
Для более глубокой настройки интерфейса (шрифты, цвета, отступы) можно вручную изменить CSS-файлы внутри контейнера.
Порядок действий:
docker exec -it datalens-ui bash
vi /app/static/css/main.css # ваш путь до CSS-файла
exit
docker restart datalens-ui
Все изменения будут утеряны при обновлении образа! Чтобы сохранить — нужно создать собственный Docker-образ.
Если требуется изменить структуру интерфейса или добавить собственную бизнес-логику, придётся пересобрать UI с нуля.
Шаги:
Клонировать репозиторий:
git clone https://github.com/datalens-tech/datalens-ui
cd datalens-ui
Внести изменения в исходники (React):
docker build -t my-datalens-ui .
Заменить image: в docker-compose.yaml:
ui:
image: my-datalens-ui
Полная кастомизация требует навыков в React, Webpack, Docker и не поддерживается официально. Использовать на свой страх и риск.