Темы и оформление модуля


Зачем	Сделать модуль бронирования частью сайта, а не инородным блоком: гость не должен замечать «перехода» на чужую страницу.
Кому	Владельцам и администраторам отеля, кто ведёт сайт; разработчик не нужен.
Что получится	Выбрана тема из шести готовых, цвета и шрифт подогнаны под сайт, в модуле и виджете стоит ваш логотип, виджет вписан в страницу по ширине.
Ограничения	Тёмного режима у модуля нет. Новые темы и опции оформления заранее не обещаем — в статье то, что есть в PMS сейчас.

Модуль бронирования живёт на вашем сайте — и выглядеть должен как часть сайта, а не как сторонний виджет. Оформление собирается в PMS из готовых деталей: тема, цвета, шрифт, логотип.

Правки занимают минуты и не требуют ни разработчика, ни изменений в коде страниц — всё делается в одном месте, в разделе «Онлайн-бронирование».

Что входит

Основа — одна из шести готовых тем: CLASSIC, MODERN, BOUTIQUE, COMPACT, VIBRANT или EMERALD. Поверх темы настраиваются цвета и шрифт, чтобы палитра модуля подстраивалась под сайт, а не наоборот. В шапку модуля и в виджет встаёт логотип отеля — гость видит бренд, а не безымянную форму.

Всё это находится в PMS, в разделе «Онлайн-бронирование» — там же, где встраивание и остальные настройки модуля: карточка «Тема» для оформления, «Настройки» для логотипа и данных отеля, «Виджет» для блока поиска на сайте.

Выбрать тему

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

Откройте в PMS раздел «Онлайн-бронирование» и выберите карточку «Тема» — шесть пресетов и кастомизация цветов.
Выберите одну из тем: CLASSIC, MODERN, BOUTIQUE, COMPACT, VIBRANT или EMERALD.
Смотрите на модуль глазами гостя в живом превью: результат виден сразу, без перезагрузки.

Итог: оформление сменилось за минуты; код сайта не трогали.

Цвета и шрифт

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

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

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

Логотип

Логотип один и тот же для модуля и виджета — загружается один раз. Подходят файлы JPG, PNG или WebP размером до 2 МБ. Живёт логотип в данных отеля: в том же блоке настроек, что название, город и контакты.

В разделе «Онлайн-бронирование» откройте карточку «Настройки».
Найдите блок «Информация об отеле» — в нём поле «Логотип».
Перетащите изображение в поле или выберите файл: подпись у поля подскажет — «JPG, PNG, WebP · до 2 МБ».

Итог: бренд отеля виден гостю и в полном модуле, и в виджете на сайте.

Ширина на разных экранах

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

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

В разделе «Онлайн-бронирование» откройте карточку «Виджет».
В блоке «Внешний вид» найдите группу «Размер и расположение».
Задайте ширину для каждого экрана: «Ширина на десктопе», «Ширина на планшете» и «Ширина на мобильном». Значение — число и единица измерения, по умолчанию px; пустое поле — без ограничения.
Проверьте результат в превью: переключатель вида: «Мобильный», «Планшет» или «Полная» показывает виджет в каждой из ширин.

Итог: виджет выглядит частью страницы на любом экране — от широкого монитора до телефона.

Виджету — своя тема

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

Это удобно, когда модуль и виджет живут на разных страницах: у каждой страницы — своё акцентное пятно, и виджет может подстраиваться под свою.

Честные границы

Тёмного режима нет. Отдельной тёмной темы у модуля нет: под тёмный сайт оформление подгоняется цветами вручную, через кастомизацию.
Новых тем не обещаем. Сколько тем и настроек появится потом — заранее не обещаем: в статье описано то, что доступно в разделе «Онлайн-бронирование» сейчас.
Оформление — внешний слой. Темы и цвета не меняют сценарий бронирования: шаги, которые проходит гость, остаются прежними.

Смотрите также

Как устроены прямые брони — что происходит с бронью с сайта после того, как гость нажал «Забронировать».
Booking Engine — вход в тему: как встроить виджет и полный модуль на сайт.
Прямые брони: частые вопросы — короткие ответы, включая «нужен ли программист для установки».