Bahober Widget

Простой способ добавить сбор отзывов на ваш сайт. Современная система отзывов с полной кастомизацией.

Простая интеграция

Добавьте виджет на сайт за 2 минуты с помощью одной строки кода

Кастомизируемый дизайн

Настройте цвета, позицию и текст под ваш бренд

Responsive дизайн

Отлично работает на всех устройствах и размерах экрана

Безопасный API

Защищенная передача данных с валидацией на сервере

Dark/Light темы

Встроенная поддержка светлой и темной темы

Быстрая загрузка

Оптимизированный код для минимального влияния на производительность

Быстрый старт

Минимальная реализация для начала работы с виджетом. Просто добавьте этот код на вашу страницу.

<!-- Минимальная реализация -->
<script src="https://cdn.bahober.uz/widget.js"></script>
<script>
  BahoberWidget.init({
    companyId: "ВАШ_ID_КОМПАНИИ"
  });
</script>

Установка

Выберите удобный способ подключения виджета к вашему проекту.

CDN метод

Самый простой способ - подключите скрипт напрямую с CDN.

<script src="https://cdn.bahober.uz/widget.js"></script>

Конфигурация

Настройте виджет под ваши нужды с помощью параметров конфигурации.

Обязательные параметры

companyId

string (required) - ID вашей компании в системе Bahober

Опциональные параметры

theme

string - "light" | "dark" - Тема виджета

position

string - "bottom-right" | "bottom-left" | "top-right" | "top-left" - Позиция кнопки

buttonText

string - Текст на кнопке виджета

apiUrl

string - Кастомный URL API (по умолчанию: https://test.api.bahober.uz)

Интеграция по фреймворкам

Примеры интеграции виджета в популярные фреймворки и библиотеки.

HTML/CSS/JavaScript

Самый простой способ интеграции - добавьте скрипт и инициализируйте виджет.

<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="UTF-8">
  <title>Мой сайт</title>
  <script src="/js/bahober-widget.js"></script>
</head>
<body>
  <h1>Добро пожаловать!</h1>
  <button onclick="BahoberWidget.openModal()">
    ⭐ Оставить отзыв
  </button>
  <script>
    BahoberWidget.init({
      companyId: "ваш-company-id",
      theme: "light",
      position: "bottom-right"
    });
  </script>
</body>
</html>

Кастомизация стилей

Настройте внешний вид виджета под ваш бренд с помощью CSS переменных.

CSS переменные

Переопределите эти CSS переменные для быстрой кастомизации.

:root {
  --bahober-primary: #007bff;
  --bahober-bg: #ffffff;
  --bahober-text: #333333;
  --bahober-border: #dddddd;
  --bahober-star-active: #ffc107;
  --bahober-radius: 8px;
}

Примеры стилей

.bahober-widget-btn {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
}

Позиционирование

Выберите позицию для кнопки виджета.

bottom-right

bottom-left

top-right

top-left

JavaScript API

Программное управление виджетом через JavaScript API.

`BahoberWidget.init(config)`

Инициализирует виджет с конфигурацией

`BahoberWidget.openModal()`

Открывает модальное окно виджета

`BahoberWidget.closeModal()`

Закрывает модальное окно

`BahoberWidget.destroy()`

Удаляет виджет со страницы

События виджета

Отслеживайте действия пользователей с помощью кастомных событий.

`bahober:reviewSubmitted`

Срабатывает после отправки отзыва

`bahober:modalOpened`

Срабатывает при открытии модального окна

`bahober:modalClosed`

Срабатывает при закрытии модального окна

API Спецификация

Детальное описание API для отправки отзывов.

Endpoint

POSThttps://test.api.bahober.uz/client-api/client/post

Структура запроса

{
  "company_id": "string",
  "description": "string",
  "grade": "number (1-5)",
  "type": "number (2)"
}

Интерактивное демо

Попробуйте виджет в действии прямо здесь.

Попробуйте виджет

Нажмите на кнопку ниже, чтобы увидеть, как работает виджет отзывов

Часто задаваемые вопросы

Как получить companyId?

Зарегистрируйтесь на платформе Bahober и получите ID в личном кабинете.

Можно ли кастомизировать цвета?

Да, переопределите CSS переменные для полной кастомизации.

Поддержка мобильных устройств?

Виджет полностью адаптивен и работает на всех устройствах.

Поддержка

Нужна помощь? Мы всегда готовы помочь вам с интеграцией.

Email поддержка

Напишите нам на почту для получения помощи

beketovgalimjan0@gmail.com

Скачать виджет

Загрузите файл виджета для локальной установки