Встройте виджет чата на ваш сайт с помощью одного тега скрипта.
Перейдите в настройки проекта и найдите раздел Ключ виджета. Этот специальный ключ используется только для виджета и не может получить доступ к другим API-эндпоинтам.
Разрешенные домены
Вы должны указать хотя бы один разрешенный домен в настройках виджета, чтобы виджет работал. Эта функция безопасности гарантирует, что ваш ключ виджета может использоваться только на авторизованных сайтах. Если оставить пустым, виджет будет заблокирован на всех доменах.
Просто добавьте этот тег скрипта в HTML вашего сайта:
<script
src="https://filebrain.pro/api/widget/v1/fbp-widget.js"
data-widget-key="wdg_ваш_ключ_виджета"
></script>Альтернативный URL
Если у вас возникли проблемы с доступом к оригинальному URL, используйте этот альтернативный:
<script
src="https://filebrainpublic.blob.core.windows.net/widget/fbp-widget.js"
data-widget-key="wdg_ваш_ключ_виджета"
></script>Готово! Виджет появится в правом нижнем углу с кнопкой-пузырьком чата.
Переопределите настройки по умолчанию с помощью дополнительных data-атрибутов:
<script
src="https://filebrain.pro/api/widget/v1/fbp-widget.js"
data-widget-key="wdg_ваш_ключ_виджета"
data-chat-header="Поддержка"
data-welcome-message="Привет! Чем я могу Вам помочь?"
data-widget-color="#4f46e5"
data-position="bottom-left"
data-tags="product, pricing"
data-language="RU"
></script>| Атрибут | Описание | По умолчанию |
|---|---|---|
| data-widget-key | Ваш API ключ виджета | Обязательно |
| data-chat-header | Заголовок окна чата | Из настроек виджета |
| data-welcome-message | Приветственное сообщение | Из настроек виджета |
| data-widget-color | Цвет кнопки виджета и акцентов (hex) | #8b5cf6 |
| data-user-message-bg | Цвет пузырька сообщения пользователя | #8b5cf6 |
| data-user-message-text | Цвет текста сообщения пользователя | #ffffff |
| data-ai-message-bg | Цвет пузырька сообщения ИИ | #f3f4f6 |
| data-ai-message-text | Цвет текста сообщения ИИ | #1f2937 |
| data-ai-avatar-url | URL пользовательского аватара ИИ | Иконка по умолчанию |
| data-user-avatar-url | URL пользовательского аватара пользователя | Иконка по умолчанию |
| data-show-unread-badge | Показывать значок непрочитанных сообщений (true/false) | true |
| data-position | Позиция виджета | bottom-right |
| data-button-size | Размер кнопки чата | 60px |
| data-tags | Теги через запятую для фильтрации файлов (например, "product, pricing") | — |
| data-language | Язык виджета для текста кнопок (EN или RU) | EN |
bottom-right
Позиция по умолчанию
bottom-left
Размещение в левом углу
Для большего контроля инициализируйте виджет программно:
<script src="https://filebrain.pro/api/widget/v1/fbp-widget.js"></script>
<script>
new FileBrainWidget({
widgetKey: 'wdg_ваш_ключ_виджета',
chatHeader: 'Поддержка',
welcomeMessage: 'Привет! Чем можем помочь?',
widgetColor: '#4f46e5',
showUnreadBadge: true,
position: 'bottom-right',
tags: 'product, pricing', // Опционально: фильтрация файлов по тегам
language: 'RU' // Опционально: 'EN' или 'RU' для текста кнопок
});
</script>Альтернативный URL
Если у вас возникли проблемы с доступом к оригинальному URL, используйте этот альтернативный:
<script src="https://filebrainpublic.blob.core.windows.net/widget/fbp-widget.js"></script>Примечание: IE11 не поддерживается из-за требований Shadow DOM.
Важно: Нажмите F12, чтобы открыть инструменты разработчика браузера и проверьте вкладку Консоль. Виджет отобразит точные сообщения об ошибках там, если что-то пойдет не так.
Ошибка: "Widget key is required" - Убедитесь, что атрибут data-widget-key присутствует и не пустой.
Ошибка: "Invalid widget key" - Ключ виджета неверный. Скопируйте его снова из настроек виджета в вашем проекте.
Ошибка: "Widget is not enabled" - Перейдите в настройки виджета и включите переключатель "Widget Active".
Ошибка: "Domain not allowed" - Добавьте ваш домен в список "Allowed Domains" в настройках виджета. Виджет не будет работать, пока не указан хотя бы один домен.
Ошибка: "Failed to fetch configuration from server" - Проверьте подключение к сети и убедитесь, что URL скрипта доступен. Если оригинальный URL заблокирован, попробуйте использовать альтернативный CDN URL: https://filebrainpublic.blob.core.windows.net/widget/fbp-widget.js
Ошибка: "Widget is not enabled" - Включите виджет в настройках виджета.
Ошибка: "Domain not allowed" - Добавьте ваш текущий домен в список разрешенных доменов в настройках виджета.
Ошибка: "Invalid widget key" - Убедитесь, что ключ виджета правильный и совпадает с тем, что в настройках виджета.
• Проверьте вкладку Network в инструментах разработчика (F12), чтобы увидеть точный ответ API
• Убедитесь, что CORS не блокирует запросы (проверьте консоль браузера на ошибки CORS)
• Виджет использует Shadow DOM - CSS страницы-хозяина не повлияет на него
• Настраивайте только через data-атрибуты или настройки виджета
• Проверьте совместимость браузера (требуется поддержка Shadow DOM)
• Все настройки виджета можно настроить в настройках виджета (находится в блоке Интеграции вашего проекта)