Сайт бронирования показывает свободное время, занимает выбранный слот один раз, отправляет подтверждение и позволяет отменить или перенести запись. Для частного специалиста проще встроить готовый календарь, а своя система нужна для сложных ресурсов.
Опишите, что именно бронирует человек
До выбора сервиса запишите единицу бронирования. Для консультации это специалист и отрезок времени, для студии добавляется помещение, для проката предмет и период, для мероприятия место и вместимость. Если два клиента не могут использовать ресурс одновременно, ресурс должен участвовать в проверке свободного слота.
Отдельно зафиксируйте длительность услуги, перерыв между визитами, рабочие часы, минимальное время до записи, срок отмены и часовой пояс. Эти правила нельзя оставлять только в тексте страницы: календарь должен учитывать их при показе доступности.
Главная проверка сайта бронирования: два человека одновременно выбирают один слот, подтверждение получает только один, а второму система предлагает новое время.
Выберите готовый календарь или собственную систему
Готовый календарь подходит, если вы бронируете консультации, занятия или услуги по времени и можете описать их стандартными слотами. Например, Cal.com позволяет создать тип события, задать доступность и встроить запись на сайт. На официальной странице перечислены inline-вставка, всплывающая кнопка, окно по клику и ссылка для письма, а код генерируется после настройки события: варианты встраивания Cal.com.
Собственная система нужна, когда свободное место зависит от нескольких ресурсов, остатков, тарифа, числа гостей или сложных правил. Гостиница, аренда оборудования и столики ресторана выглядят похоже на календарь, но имеют другую модель вместимости и отмен. В таком проекте сначала делайте прототип данных, а не красивую страницу.
- Один специалист и фиксированные услуги: готовая страница записи или встроенный календарь.
- Несколько специалистов с одинаковыми услугами: календарь должен учитывать отдельную доступность каждого ресурса.
- Аренда по дням: нужна проверка пересечения периодов, а не только списка начальных слотов.
- Места, номера и товары: нужен учёт вместимости или остатков, обычный календарь встреч может не подойти.
- Нестандартные правила и внешняя учётная система: сначала проектируется обмен данными и защита от повторной операции.
Если у вас ещё нет страницы с услугами, ценами и контактами, начните с сайта услуг. Бронирование добавляется поверх понятного предложения, а не заменяет описание услуги.
Понимания, как это устроено, уже достаточно, чтобы начать. На бесплатном эфире сайт собирают за один вечер и показывают, как его выложить.
Посмотреть, как собратьСоберите минимальный сценарий записи
Страница должна вести человека по короткому пути: услуга, специалист или ресурс, дата, время, контакты, подтверждение. Не просите адрес, дату рождения или подробный комментарий, если они не нужны для исполнения услуги. Рядом с формой разместите ссылку на политику обработки персональных данных, объясните цель сбора контактов и получите требуемое согласие до отправки.
- Создайте одну тестовую услугу с реальной длительностью и отдельным календарём исполнителя.
- Задайте доступность, перерывы и часовой пояс. Не открывайте все часы по умолчанию.
- Подключите календарь исполнителя, чтобы личные занятые события закрывали соответствующее время, если выбранный сервис это поддерживает.
- Скопируйте штатный код встраивания и поставьте календарь на отдельную страницу сайта.
- Настройте страницу успеха, письмо или сообщение с датой, временем, часовым поясом и способом отмены.
- Откройте только тестовые даты и пройдите весь путь двумя разными адресами.
- После приёмки добавляйте остальные услуги, сотрудников и оплату по одному.
В официальном руководстве Cal.com доступность задаётся через расписания, которые можно связать с типами событий; там же описана работа с несколькими расписаниями: документация по availability. У другого сервиса названия экранов будут отличаться, но принцип остаётся тем же: показывать можно только время, которое прошло все ограничения.
По теме: Как сделать сайт-форум: движок, разделы и модерация
Встройте календарь так, чтобы был запасной путь
Inline-календарь удобен, когда запись является главным действием страницы. Всплывающее окно подходит для нескольких кнопок на длинной странице. Ссылка подходит как запасной путь: если вставка не загрузилась из-за блокировщика, слабой сети или ограничений браузера, человек всё равно сможет открыть календарь отдельно.
После вставки проверьте страницу на узком экране. Календарь не должен обрезаться по ширине, а кнопка подтверждения должна быть доступна без горизонтальной прокрутки. Не прячьте цену, длительность и условия отмены внутри внешнего окна. Покажите их на своей странице до выбора времени.
Если нужен только сбор пожелания без свободных слотов, календарь избыточен. Используйте обычную заявку и вручную согласуйте время. Как устроить отправку и не потерять обращения, разобрано в инструкции про сайт с формой.
Один собранный сайт учит больше десяти инструкций, потому что ошибки видны сразу. На бесплатном эфире по вайбкодингу показывают, как описать идею словами и получить работающую страницу, а участникам достаётся гайд.
Собрать сайт с ИИНастройте подтверждение, перенос и отмену
Подтверждение должно повторять услугу, дату, время, часовой пояс, адрес или ссылку встречи и способ отмены. Если запись считается окончательной только после оплаты или ручного одобрения, так и напишите. Статус «заявка получена» не равен статусу «время забронировано».
Для переноса безопаснее отменить старый слот только после успешного выбора нового. Иначе человек может потерять запись из-за закрывшегося окна или ошибки платежа. Для отмены используйте уникальную ссылку из подтверждения и не просите человека присылать секретные данные в мессенджере.
Предоплату подключайте после того, как бесплатный тестовый поток работает без дублей. Сверьте успешную оплату, возврат, отмену и повторную доставку уведомления. Отдельный план есть в статье про сайт с оплатой.
По теме: Как сделать CMS-сайт: пошаговый план в 2026 году
Проверьте сайт матрицей приёмки
Не ограничивайтесь одной удачной записью администратора. Создайте короткую таблицу: сценарий, ожидаемый статус слота, письмо клиенту, событие у исполнителя и запись в панели. Каждый тест считается пройденным только при совпадении всех пяти результатов.
- Два человека одновременно подтверждают один слот: создаётся одна запись.
- Клиент и исполнитель в разных часовых поясах: каждый видит корректное местное время и явное обозначение зоны.
- Клиент отменяет запись: слот возвращается в доступность по заданному правилу.
- Клиент переносит запись: новая появляется, старая освобождается, оба изменения подтверждены.
- Календарь исполнителя временно недоступен: сайт не показывает сомнительные слоты как свободные.
- Письмо попало в спам: запись всё равно видна на странице успеха и доступна в панели.
- Страница открыта с телефона: выбор даты, ввод данных и отмена доступны без увеличения экрана.
Диагностика частых сбоев
Слот отображается занятым без причины: проверьте часовой пояс, подключённые календари, буфер и скрытые повторяющиеся события. Двойная запись появилась: выясните, где выполняется окончательная проверка. Она должна происходить в системе бронирования в момент подтверждения, а не только в браузере до отправки формы.
Подтверждение не пришло: найдите запись в панели, затем журнал отправки, адрес отправителя и папку спама. Не просите клиента бронировать снова, пока не убедились, что первая попытка отсутствует. Виджет пустой только на сайте: откройте прямую ссылку, проверьте блокировщик, политику встраивания и ошибки браузера.
Если одно и то же событие создаётся дважды, ищите повторный запуск после обновления страницы или повторную обработку уведомления. Используйте уникальный идентификатор операции и делайте повтор безопасным: второй одинаковый запрос должен вернуть уже созданную запись, а не создавать новую.
По теме: Как сделать Метрику на сайте: установка и проверка
Ограничения и случаи, когда нужен другой продукт
Календарь встреч не подходит для гостиничных номеров, столов, билетов или проката, если он не умеет учитывать нужную вместимость и пересечения периодов. Не пытайтесь исправить это запретом в тексте. Выбирайте специализированную систему или проектируйте модель ресурсов.
При редких заявках ручное согласование может быть дешевле и понятнее автоматизации. Если у вас нет стабильного расписания, ответственного за изменения и канала поддержки, автоматический календарь будет показывать неверную доступность. Сначала наладьте процесс, затем переносите его на сайт.
Частые вопросы
Можно ли сделать сайт бронирования без кода?
Да, если задача укладывается в готовый календарь и его можно встроить в конструктор или CMS. Код понадобится при нестандартных ресурсах, обмене с внутренней системой или особых правилах подтверждения.
Нужна ли регистрация клиенту?
Для разовой услуги обычно достаточно подтверждённого контакта и уникальной ссылки управления записью. Кабинет нужен, когда клиент возвращается, хранит историю и управляет несколькими бронированиями.
Как не допустить двойную запись?
Проверяйте свободный ресурс ещё раз в момент подтверждения и создавайте бронь одной неделимой операцией. Проверка только при показе календаря устаревает, пока человек заполняет форму.
Что делать, если внешняя вставка не загрузилась?
Покажите прямую ссылку на запись и контакт для ручного согласования. Затем проверьте доступность сервиса, блокировщики и ошибки в коде вставки.
На воркшопе по сайтам с ИИ вы соберёте страницу услуги, добавите нужный сценарий и проверите первую версию на телефоне.
Собрать сайт