E-commerce: Продвижение и запуск интернет магазина
Полезные статьи и инструкции по продвижению, запуску и развитию интернет-магазинов в сфере E-commerce

Как запустить сайт бронирования и систему онлайн-записи: полное руководство по созданию и настройке



Интерфейс модуля бронирования: выбор услуг, календарь со свободными интервалами и кнопка мгновенного подтверждения записи


Сферы применения: Кому и зачем нужен модуль бронирования?

Модуль онлайн-записи от BooStore.pro — это универсальный инструмент автоматизации, который избавляет бизнес от «ручного» управления расписанием, исключает ошибки и позволяет клиентам бронировать услуги в режиме 24/7.

👨‍⚕️

Услуги и специалисты

Идеально для записи к врачам, в салоны красоты, фитнес-центры или на частные юридические и бизнес-консультации.

🍽️

Аренда ресурсов

Управление бронированием столиков в ресторанах, массажных кресел, кабинетов или номеров в небольших отелях.

🚗

Транспорт и прокат

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

🎟️

События и группы

Продажа мест на мастер-классы, групповые экскурсии, вебинары или запись на спортивные мероприятия.

Гибкость и логика «Свободно/Занято»

Главная проблема большинства систем бронирования — их изолированность. В BooStore.pro модуль записи является частью «организма» статистики продаж. Это означает, что каждое бронирование — это реальный заказ, а каждый временной слот — это статус этого заказа в реальном времени.

🤖 Автоматический контроль слотов

Система понимает занятость не просто по наличию записи, а по статусу заказа в вашей админ-панели. Как только клиент выбирает время и подтверждает форму, создается заказ.

Пока заказ находится в статусах В обработке или Оплачен, система блокирует это время для других пользователей. Вам не нужно вручную «закрывать» даты — алгоритм делает это мгновенно.

👥 Групповые записи (Multiply): Один слот — много мест

Что делать, если у вас не один массажист, а три? Или вы продаете 10 билетов на один мастер-класс? Здесь вступает в дело параметр data-booking-slot-allow-multiply.

Как это работает: Вы указываете количество доступных мест (например, 10). Система будет показывать это время как Свободное до тех пор, пока количество успешных заказов на этот час не достигнет лимита. Только после 10-го клиента слот станет "занятым".

⚡ Почему отмена в админке — это магия для сайта

Гибкость BooStore.pro проявляется в моменты изменений. Представьте ситуацию: клиент позвонил и отменил запись. Вы заходите в статистику продаж и меняете статус заказа на Отменен.

Мгновенная реакция: В ту же секунду, без перезагрузки кэша или ручных правок, этот временной слот на сайте снова становится доступным для бронирования другими людьми.

Эта связка работает и в обратную сторону: вы можете вручную создать заказ в админке на определенное время (например, запись по телефону), и сайт тут же «узнает», что это время теперь занято.

Такая архитектура исключает "человеческий фактор" и риск овербукинга (двойных записей) на 100%.

Умное управление временем

⏲️ Гибкий шаг времени (Time Slots)

Вы сами решаете, как дробить рабочий день. Параметр data-booking-slot-booking-time позволяет задать шаг в секундах. Хотите запись на быстрые консультации по 15 минут? Ставьте 900. Нужна аренда зала на 3 часа? Ставьте 10800.

09:00
09:15
09:30
09:45

🛡️ Динамические лимиты и защита от «сюрпризов»

Система позволяет настроить горизонт планирования так, чтобы это было удобно вашему персоналу.

  • Минимальный порог: Ограничьте запись «не ранее чем за X часов». Это спасет вас от ситуации, когда клиент записывается «на сейчас», а вы еще не готовы.
  • Максимальный предел: Укажите endofmonth или конкретную дату, чтобы клиенты не бронировали ресурсы на год вперед.
  • Смещение дат: Возможность бронирования со смещением (начало сегодня — конец завтра).

🎨 Буферные зоны для идеального UI

Чтобы интерфейс не выглядел «дырявым», используйте параметр data-booking-time-show-empty. Он позволяет отображать неактивные временные интервалы до начала доступного времени. Это создает визуальный порядок и показывает клиенту полную сетку вашего рабочего дня, даже если утро уже занято или недоступно.

4. Ценообразование и монетизация

💰 Динамический расчет стоимости

BooStore.pro умеет считать деньги за вас. Если у вас установлена базовая цена за 1 час, а клиент выбирает в селекторе 3 часа — система автоматически применит коэффициент.

Базовая цена (1ч): $50   |   Выбрано: 3 часа   |   Итого к оплате: $150

Если же длительность не должна влиять на стоимость (например, фиксированный билет на квест), просто активируйте параметр data-booking-slot-fixed-price.

💳 Моментальный прием оплаты

Для бизнеса, где важна гарантия явки, предусмотрена функция data-booking-payment-required.

Как только пользователь нажимает «Забронировать», система не просто создает заказ, а мгновенно переадресовывает его на выбранный платежный шлюз. Бронь подтверждается только после успешной транзакции, что сводит процент «пустых» записей к нулю.

Быстрый старт: Превратите любую кнопку в систему записи

Уникальность платформы BooStore.pro в том, что вам не нужно менять структуру сайта. Достаточно подключить скрипт и добавить нужные атрибуты к любому HTML-элементу (кнопке, ссылке или блоку), чтобы активировать профессиональный виджет бронирования.

Шаг 1: Подключите ресурсы

Добавьте эти строки в раздел или перед закрывающим тегом :


rel="stylesheet" type="text/css" href="/templates/styles/booking/css_hotengine_booking.css" />
Шаг 2: Создайте кнопку бронирования

Достаточно создать контейнер с атрибутом data-booking и поместить в него кнопку с классом booking-slot-start-order.

Полный справочник параметров (Data-attributes)

📂 Основные настройки
data-booking-form-id="XX" Обязательно
ID формы из Конструктора форм для обработки заказа.
data-booking-window-title="Текст"
Заголовок всплывающего окна (по умолчанию «Бронирование»).
data-booking-slot-group-id="0"
Цифровой ID группы объектов. Позволяет разделить ресурсы (столики, авто, кабинеты), чтобы клиент видел расписание только конкретной группы.
data-booking-slot-group-title="Название"
Название объекта в заказе. Если не указано, берется имя группы из настроек.
data-booking-product-id="XX"
ID товара для жесткой фиксации его в заказе.
data-booking-form-captcha="false"
Отключает проверочный код (captcha), если он активирован в настройках формы.
📅 Ограничения календаря
data-booking-slot-min-calendar-date-form-now=""
Минимальная дата бронирования. Формат days:+X,hours:+Y.
Доступны: month, weeks, days, hours.
data-booking-slot-max-calendar-date-form-now=""
Максимальная дата в часах (неделя — 168) или константы: endofmonth, endofnextmonth, endofyear, endofnextyear.
data-booking-slot-max-calendar-date="2027-05-20"
Абсолютная крайняя дата отображения в календаре.
🕒 Время и Слоты
data-booking-slot-booking-time="1800"
Базовый интервал (шаг) времени в секундах (1800 — 30 мин, 3600 — 1 час).
data-booking-slot-max-booking-time="10800"
Максимальное время для одного бронирования.
data-booking-slot-max-booking-time-show-selector="true"
Включает выбор лимита времени (зависит от параметра выше).
data-booking-slot-booking-time-allowchange="true"
Разрешить «обрезать» выбор времени, если доступный остаток периода меньше желаемого.
data-booking-time-show-empty="1"
Показ пустых неактивных слотов перед доступным временем: 0 — выкл, 1 — все, 2 — после минимального.
data-booking-slot-time-format="12"
Формат времени. По умолчанию 24ч. При значении 12 — формат AM/PM.
👥 Групповая логика и Повторы
data-booking-slot-allow-multiply="10"
Количество доступных мест на один слот (для групповых мероприятий).
data-booking-slot-allow-preorder="0"
Логика доступности слота при необработанных заказах:
0: занят (статус "Не обработан")
1: свободен ("Не обработан")
2: свободен ("В обработке")
3: свободен (0 и 2 статусы)
data-booking-slot-days-extended="true"
Разрешить бронирование со смещением дат (выбор даты начала и даты конца).
💳 Оплата и Статусы
data-booking-slot-price="10USD"
Цена за базовый период. При выборе нескольких периодов происходит автопересчет (коэффициент).
data-booking-slot-fixed-price="1"
Фиксированная цена (автопересчет и коэффициенты отключены).
data-booking-status-after="0"
Статус заказа сразу после бронирования:
0: Не обработан
1: В обработке
3: Обработан
2, 5, 6: Отменен
data-booking-payment-required="1"
Требовать оплату. После заказа — автоматическая переадресация на платежный шлюз.
data-booking-payment-system="XX"
ID конкретной платежной системы из админки.
data-booking-payment-system-hide-selector="true"
Скрывает выбор других платежных систем при переадресации.
data-booking-status-after-payment="3"
Статус, который будет установлен заказу автоматически после успешной оплаты.

🚀 Полная гибкость под любой бизнес-процесс

Сочетание этих параметров позволяет настроить всё: от простой записи в салон красоты до сложной системы аренды оборудования с посуточной оплатой и автоматическим изменением статусов. Ваша фантазия — единственный лимит.

Открыть полную инструкцию подключения
🎨 Визуальная индикация статусов

Скрипт автоматически управляет состоянием элементов. Когда слот занят, ему присваивается атрибут data-booking-status="busy". Вы можете задать любой CSS-стиль для таких элементов, чтобы визуально выделить их для пользователя.

/* Пример CSS для выделения занятого слота */
[data-booking-status="busy"] { opacity: 0.5; pointer-events: none; filter: grayscale(1); }
Реальные примеры интеграции

Ниже приведен готовый фрагмент кода для создания кнопки бронирования группы №1 с часовым интервалом и автоматическим расчетом цены:

booking-slot" data-booking data-booking-slot-group-id="1" data-booking-slot-group-title="Title" data-booking-slot-booking-time="3600" data-booking-slot-booking-time-allowchange="true" data-booking-time-show-empty="1" data-booking-slot-max-booking-time="10800" data-booking-slot-max-booking-time-show-selector="true" data-booking-slot-min-calendar-date-form-now="" data-booking-slot-max-calendar-date-form-now="endofnextmonth" data-booking-slot-max-calendar-date="" data-booking-slot-allow-multiply="0" data-booking-slot-days-extended="0" data-booking-slot-allow-preorder="0" data-booking-form-id="ВАШ_ID_ФОРМЫ" data-booking-slot-price="10USD" data-booking-slot-fixed-price="false" data-booking-payment-required="false" data-booking-status-after="0" data-booking-status-after-payment="1" data-booking-slot-time-format="24" data-booking-window-title="Бронирование">
display:block; margin:15px auto; font-size:140%;">Group 1
booking-slot-status-block"> booking-slot-start-order">
Где увидеть живой пример?

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

🎱 Бронирование бильярдных столов
💸 Поддержка чаевых при оплате
🕒 Шаг времени 1 час
📱 Полная адаптивность
Посмотреть живой пример (PeakyClub)
🛠️ Advanced: Callback-функции для разработчиков

Для глубокой интеграции и отслеживания каждого шага пользователя используйте функцию callback_hotengine_booking_form($a). Она позволяет внедрять свои скрипты (аналитику, проверку данных, уведомления) на любом этапе бронирования.

function callback_hotengine_booking_form(step) {
  console.log('Текущий этап бронирования:', step);
  if (step === 10) { /* Ваш код при подтверждении */ }
}
ID ($a) Описание события
2Перед запросом списка свободных слотов
3Список свободных слотов сформирован и выведен
4Пользователь нажал кнопку «Назад» / Показать слоты с указанной даты
6Начало процесса подтверждения (выбор конкретного слота)
7Перед отправкой подтверждения бронирования
8Формирование финального списка данных перед отправкой
9Момент перед непосредственной отправкой выбранного слота
10Отправка формы подтверждения бронирования (Action)
1Финальный результат (успешная отправка или ошибка)

Управление и аналитика: Полный контроль над записями

Модуль бронирования BooStore.pro — это не просто виджет на сайте, а полноценная CRM-система. Все данные о бронированиях мгновенно синхронизируются с вашей панелью управления, предоставляя детальную отчетность и инструменты для работы с клиентами.

📊 Детальная статистика продаж

  • Данные покупателя: Полная информация из формы (имя, телефон, email, доп. поля).
  • Детализация слотов: Четкое указание выбранных дат и временных интервалов.
  • Прозрачное ценообразование: В каждом заказе видна базовая цена за час, примененный коэффициент и итоговая стоимость.
  • Управление статусами: Меняйте статусы («В обработке», «Подтвержден», «Отменен») прямо в таблице продаж.
Пример: 1 час ($10) × 3 (коэффициент) = $30 Итого

📅 Административный календарь

  • Наглядный обзор: Визуальная сетка всех занятых и свободных слотов на день, неделю или месяц.
  • Мгновенная инфо: При клике на занятый слот открывается карточка с данными о заказчике и статусе оплаты.
  • Контроль оплат: Визуальные маркеры оплаченных и неоплаченных броней.
  • Гибкое редактирование: Возможность оперативно управлять каждым конкретным слотом через административный интерфейс.

💡 Почему это важно для бизнеса?

Вы не просто получаете уведомление о заказе, вы видите всю экономику процесса. Система автоматически рассчитывает выручку, учитывая длительность бронирования, и позволяет администраторам работать в едином визуальном поле календаря, исключая риск "накладок" или двойных броней.

🔌 Управление бронированием через Commerce API

Все данные модуля бронирования доступны для интеграции через Commerce API. Вы можете управлять слотами, создавать и обновлять заказы с бронированием, а также получать данные календаря программно — для синхронизации с внешними CRM, мобильными приложениями или кастомными дашбордами.

GET
/api/commerce/booking
Получить список слотов с фильтрацией по дате, группе, типу
GET
/api/commerce/booking/{id}
Получить слот по ID
POST
/api/commerce/booking
Создать новый слот бронирования
PUT
/api/commerce/booking[/{id}]
Обновить слот (по ID, group_id или slug_search)
DELETE
/api/commerce/booking/{id}
Удалить слот по ID
POST
/api/commerce/orders
Создать заказ с данными бронирования (booking_data)
PATCH
/api/commerce/orders/{id}
Обновить бронирование в существующем заказе
GET
/api/commerce/orders/{id}
Получить заказ с расшифровкой брони (поля booking, booking_data)
📖 Подробнее: Полная документация по каждому методу, включая таблицу полей слота, примеры запросов и описание приоритетов поиска доступна в разделе Booking API на странице документации Commerce API вашего аккаунта.

❓ Часто задаваемые вопросы о бронировании

Ответы на самые распространённые вопросы по настройке и использованию модуля онлайн-записи BooStore.pro

Доступна ли на Бустор функция бронирования?

Да, на платформе BooStore.pro доступен полноценный модуль онлайн-записи и бронирования. Он включает в себя интерактивный календарь для управления временными слотами, гибкую систему статусов для отслеживания этапов выполнения заказов, а также поддержку автоматической онлайн-оплаты при оформлении записи. Кроме того, модуль полностью совместим с Commerce API, что позволяет осуществлять удалённое управление, синхронизировать данные с внешними системами и автоматизировать рабочие процессы.

Можно ли использовать модуль бронирования на бесплатном тарифе?

Да. Модуль бронирования доступен на всех тарифах, включая бесплатный. Вы можете создавать неограниченное количество групп слотов (ресурсов) и принимать заказы через виджет. На бесплатном тарифе действуют стандартные ограничения по количеству товаров и заказов в месяц, но сам функционал бронирования не заблокирован.

Как настроить обязательную предоплату для бронирования?

Используйте атрибут data-booking-payment-required="1". После выбора времени и отправки формы клиент будет автоматически перенаправлен на платный шлюз. Статус заказа изменится на «Оплачен» только после успешной транзакции, и слот станет занятым. Дополнительно настройте data-booking-status-after-payment для автоматической смены статуса после оплаты.

Как сделать групповую запись (несколько мест на один слот)?

Добавьте атрибут data-booking-slot-allow-multiply="N", где N — количество доступных мест. Например, для мастер-класса на 10 человек укажите значение 10. Система будет показывать слот как свободный, пока количество подтверждённых заказов не достигнет лимита. Каждый новый заказ уменьшает счётчик свободных мест.

Почему слот на сайте остаётся занятым после отмены заказа?

Проверьте настройку data-booking-slot-allow-preorder. Если значение 0 (по умолчанию), слот считается занятым, пока заказ имеет статус «Не обработан». При отмене заказа (статус «Отменён»), слот освобождается. Если проблема остаётся, убедитесь, что статус заказа действительно изменён на отменённый (2, 5 или 6), а не на «В обработке».

Можно ли синхронизировать бронирования с Google Календарём или Outlook?

Прямой синхронизации с внешними календарями в стандартной поставке нет. Однако вы можете использовать Commerce API для программной выгрузки данных о бронированиях и настроить интеграцию через сторонние сервисы (Zapier, Make) или собственный скрипт. Все данные календаря (даты, время, статусы) доступны через GET /api/commerce/orders с полями booking и booking_data.

Как ограничить глубину бронирования (не дальше чем через месяц)?

Используйте атрибут data-booking-slot-max-calendar-date-form-now. Для ограничения в один месяц укажите значение endofnextmonth. Также доступны константы endofmonth, endofyear, endofnextyear или absolute дата в data-booking-slot-max-calendar-date.

Работает ли модуль на телефонах и планшетах?

Да. Виджет бронирования полностью адаптивен. Интерфейс календаря и выбора времени корректно отображается на всех устройствах, включая смартфоны с шириной экрана от 320px. Для мобильных устройств предусмотрены отдельные стили и упрощённая навигация.

Как изменить цену в зависимости от длительности бронирования?

Укажите базовую цену за шаг времени в атрибуте data-booking-slot-price="10USD", где 10USD — цена за один базовый интервал (шаг задаётся в data-booking-slot-booking-time). Система автоматически умножит базовую цену на количество выбранных интервалов. Если цена фиксированная и не должна меняться от длительности, добавьте data-booking-slot-fixed-price="1".

Можно ли выгружать данные о бронированиях в Excel или CRM?

Да. Все заказы, включая бронирования, доступны в стандартной таблице статистики продаж в админ-панели. Вы можете экспортировать данные в CSV/XLS. Для автоматической выгрузки используйте Commerce API: GET /api/commerce/orders с фильтрацией по дате. В ответе приходят все поля заказа, включая booking и booking_data с детализацией слота.

Что произойдёт, если два клиента выберут одно и то же время одновременно?

Система блокирует слот на уровне базы данных в момент подтверждения заказа. Если два пользователя одновременно нажмут «Забронировать», первый запрос создаст заказ и заблокирует время, а второй получит ошибку о том, что слот уже занят. Двойные записи (овербукинг) исключены на уровне архитектуры.

✅ Все готово к запуску!

Используйте сочетание data-атрибутов для логики, CSS для стиля занятых слотов и Callback-функции для полного контроля над поведением системы. BooStore.pro предоставляет полный функционал для создания сайта бронирования любых услуг. Статусы, Оплыта онлайн и полный контроль.

Пошаговая Инструкция по созданию интернет-магазина с поисковым фильтром и мобильной версией
Как открыть интернет-магазин в Украине официально: ПРРО, налоги, ФОП и прием платежей на сайте
Как открыть интернет-магазин обуви быстро и легко — пошаговый гайд 2026