Перейти к содержанию

Принципы работы виджета

Автор Кирилл ОсинскийОбновлено

Виджет Go2Buy — это встраиваемый веб-интерфейс покупки билетов. Он позволяет партнёру продавать билеты mooon и Silver Screen на своей площадке, не реализуя собственный выбор мест и оплату.

Суть

Виджет работает как отдельный интерфейс внутри чужой страницы. Пользователь видит страницу партнёра, но путь выбора события, сеанса, мест и оплаты проходит через Go2Buy.

В рабочей терминологии проекта:

  • go2.by — канал widget;
  • виджет и Go2Buy — одна сущность;
  • встраивание нужно для сторонних афиш, сайтов торговых центров, партнёрских сервисов и других внешних контуров.

Базовое подключение

Партнёр подключает скрипт виджета к своей странице. Рекомендуемое место — конец body.

<script src="https://go2.by/widget/ticketslab-widget.js"></script>

После подключения доступен объект tlWidget.

Документация Go2Buy по подключению виджета

Модальное окно

Для открытия виджета в pop-up используется загрузка с пустым объектом и отдельный обработчик на кнопку партнёра.

tlWidget.load({});

element.addEventListener("click", () => tlWidget.open());

После клика пользователь остаётся на странице партнёра, а поверх неё открывается окно покупки.

Виджет как модальное окно

Контейнер на странице

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

<div id="tl-widget-container"></div>

tlWidget.load({
    mode: "container",
    params: {
        containerId: "tl-widget-container",
    }
});

После вызова load() виджет встраивается в этот блок.

Виджет в контейнере

Этапы запуска сценария

Виджет можно открыть на разных этапах покупки. Для этого используется параметр stage.

stage Что открывается Что нужно передать
afisha выбор фильма или события можно использовать как базовый режим
shows выбор сеанса для конкретного события eventId
hall выбор места в зале для конкретного сеанса showId

Примеры:

tlWidget.load({});

tlWidget.load({
  stage: "shows",
  params: {
      eventId: 4431,
  }
});

tlWidget.load({
  stage: "hall",
  params: {
      showId: 392112,
  }
});

Этапы интеграции виджета

Оформление

Документация Go2Buy фиксирует две темы:

  • light — светлая тема;
  • dark — тёмная тема.
tlWidget.load({
    theme: "dark"
});

tlWidget.load({
    theme: "light"
});

Настройка темы виджета

УНП партнёра

Для корректного учёта продаж при интеграции передаётся УНП партнёра.

tlWidget.load({
    partnerNIP: 123456789
});

Важно

Если partnerNIP не передан, продажи могут записаться на УНП по умолчанию. Это влияет на отчёты и разбор продаж по партнёрам.

Частые ошибки

  • Партнёр открыл общий go2.by, хотя нужен переход сразу к залу. Для такого сценария нужен stage: "hall" и showId.
  • Виджет встроен в контейнер без стабильных размеров. Пользователь видит обрезанный интерфейс или не может выбрать места.
  • Не передан partnerNIP. Продажи сложнее корректно связать с партнёром.
  • Поддержка разбирает инцидент без URL. Для диагностики нужен полный адрес с параметрами showId, eventId, partnerNIP, если они есть.

Связанные страницы