Skip to content
TicketCRM Documentation

Widget Configurator

Use this interactive tool to:

  • choose a widget type (tbx-widget, tbx-modal, tbx-button);
  • fill in the required and optional parameters;
  • check the live preview;
  • copy the ready-to-use embed code for the chosen type.

Налаштування віджета

* обовʼязкові поля

Унікальний ідентифікатор події. Можна вказати кілька через кому.

Формат вбудовування: спливаюче вікно, повний екран, кнопка переходу або інлайн-iframe.

Напис на кнопці, що відкриває віджет. Це не атрибут, а текст вкладеної кнопки — він потрапляє в код вбудовування.

Мова інтерфейсу віджета.

Валюта відображення цін. За замовчуванням — валюта події.

Візуальна тема оформлення віджета.

Розміри віджета — CSS-значення, напр. 800px, 100% або 100vh.

Ідентифікатор продавця для атрибуції продажів.

Ідентифікатор абонемента / сезону замість окремої події.

Куди перенаправити покупця після оформлення замовлення з оплатою за рахунком (інвойс).

Куди перенаправити після успішної оплати або безкоштовної покупки.

Адреса, на яку веде кнопка «назад» / логотип у віджеті.

URL логотипа, що показується в шапці віджета.

Базовий URL віджета. Зазвичай не змінюють — потрібен для стейджингу чи власного домену.

Відкривати модалку автоматично, якщо в URL сторінки є відповідний хеш.

Завантажувати iframe заздалегідь, ще до відкриття модалки.

Надсилати події віджета в батьківське вікно через postMessage — для зовнішньої аналітики.

Попередній перегляд

Вкажіть валідний хеш події для рендеру preview.

Код для вбудовування

Вставте цей фрагмент у HTML-код вашого сайту в тому місці, де має з'явитися віджет. Скрипт підключиться автоматично.

<!-- Додайте валідний хеш події, щоб згенерувати код -->

Пряме посилання

Готовий URL сторінки віджета з параметрами — те саме, куди веде «Кнопка переходу». Скопіюйте та вставте як звичайне посилання (кнопка, лист, соцмережі).

<!-- Додайте валідний хеш події, щоб згенерувати код -->

How does it work?

Section titled “How does it work?”

TicketCRM is loaded as web components via a module script (https://wc.ticketcrm.com/lib/tbx-widget.min.js). After adding the component tag with the event-hash, the widget renders in the selected mode. The bundle registers three tags used here:

  • tbx-widget — an inline iframe embedded directly in the page;
  • tbx-modal — a popup opened by a button; add full-screen="true" for a full-screen overlay;
  • tbx-button — a button that opens the widget page in the same tab.

Every attribute maps to a query parameter that is forwarded to the widget iframe. The widget also automatically forwards UTM tags, ad click IDs (gclid, fbclid, ttclid, …) and GA4 identifiers from the host page — no configuration required.

Required parameters

Section titled “Required parameters”
  • event-hash — the event identifier (comma-separated for multiple events).
  • Widget type — the component/UX scenario.
  • Button text — label of the trigger button (for modal, fullscreen, button).

Localization & sizing

Section titled “Localization & sizing”
  • lang — uk, en, de, lv, sk, el, ru.
  • currency — currency code (e.g. UAH, EUR, USD).
  • theme — ticketsbox, silpo, or etko.
  • width / height — dimensions for inline and modal.
  • open-by-hash / preload — modal behavior toggles.

Optional parameters

Section titled “Optional parameters”
  • Seller & event: seller-hash (sales attribution), abonement-hash (season / abonement instead of a single event).
  • Redirects & branding: thanks-invoice-url (return after placing an invoice / deferred-payment order), thank-success (after a successful or free purchase), home-url and home-logo-url (address and logo for the “back” button).
  • Advanced: widget-url (override the iframe base URL), analytics-mode (forward widget analytics events to the parent window via postMessage).
Section titled “Direct link”

Besides the embed code, the configurator builds a direct link — a ready widget-page URL with the same parameters (the same destination tbx-button points to). Paste it anywhere as a plain link: a button on your site, an email or a social post.