Виджеты vivaCRM отправляют события в Яндекс.Метрику **автоматически** — сигналы улетают в Метрику сами, без ручной разметки сайта.

:::callout{type="warning"}
Условие одно: на сайте должен стоять счётчик Метрики, а в настройках **каждого** виджета указан [[ID Яндекс.Метрики]] этого счётчика.

Если ID не указан — события могут не передаваться. Если «цели не стреляют», начните проверку именно с этого пункта.

:::

## Где указать ID счётчика

:::step
Перейдите на [vision.usrm.ru/widgets](https://vision.usrm.ru/widgets) и откройте нужный виджет.

:::

:::step
Вставьте **числовой** ID счётчика и сохраните.

:::

:::pagelink{slug="kak-sozdat-i-upravlyat-vidzhetami"}
:::

## Что значит «автоматические события»

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

Дальше вы используете эти события как обычные **цели** в Метрике — для отчётов, ретаргетинга и оптимизации рекламы.

:::callout{type="info"}
Термин «автоматические» у нас про виджет: он сам отправляет события. В самой Метрике они оформляются как цели типа **«JavaScript-событие»**.

:::

:::collapse
Официальная справка Яндекс.Метрики

* [JavaScript-цель (цель по событию)](https://yandex.ru/support/metrica/general/goal-js-event.html)

* [Как фиксируется достижение цели (reachGoal)](https://yandex.ru/support/metrica/objects/reachgoal.html)

* [Автоматические цели Метрики](https://yandex.ru/support/metrica/general/auto-goals.html)

:::

## Как настроить цели по событиям

:::step
В Метрике зайдите в нужный счётчик и откройте раздел [[Цели]].

:::

:::step
Выберите тип цели **«JavaScript-событие»**. В поле [[Идентификатор цели]] укажите имя события **ровно** как в списках ниже.

:::

:::step
После сохранения цель доступна в отчётах Метрики, в сегментах и в Яндекс.Директе — для оптимизации и ретаргетинга (если связка настроена).

:::

## Параметры событий (exercise_name и т.п.)

У части событий виджет отправляет дополнительные параметры — например [[exercise_name]], [[services[].name]], [[subscription_name]].

:::callout{type="warning"}
В настройках цели параметры **не указываются** — в цели вы задаёте только идентификатор события. Параметры передаются автоматически вместе с событием через `reachGoal`, и Метрика сохраняет их как параметры визита.

:::

**Где смотреть и фильтровать:**

1. Откройте Метрику → **Отчёты → Параметры визитов**.

2. Найдите нужный параметр (например [[exercise_name]] или [[widget]]).

3. Фильтруйте визиты по значению.

Например, параметр `widget: "3WWom"` будет виден в *Отчёты → Параметры визитов* — там же строятся фильтры и сегменты по этому значению.

## Списки событий

::::tabs
:::tab
### Открытие и закрытие

| Событие         | Что означает               |
| --------------- | -------------------------- |
| `WIDGET_OPENED` | Пользователь открыл виджет |
| `WIDGET_CLOSED` | Пользователь закрыл виджет |

### Выбор занятия и действия с записью

| Событие                      | Что означает                | Параметры                         |
| ---------------------------- | --------------------------- | --------------------------------- |
| `EXERCISE_SELECTED`          | Выбрал занятие в расписании | `exercise_id`, `exercise_name`    |
| `USER_ADDED_TO_WAITLIST`     | Добавился в лист ожидания   | `exercise_id`, `exercise_name`^*^ |
| `USER_REMOVED_FROM_WAITLIST` | Удалился из листа ожидания  | `exercise_id`, `exercise_name`^*^ |
| `USER_CANCELLED_BOOKING`     | Отменил запись на занятие   | `exercise_id`, `exercise_name`^*^ |

### Оплата

| Событие                             | Что означает                                     | Параметры                                    |
| ----------------------------------- | ------------------------------------------------ | -------------------------------------------- |
| `CLICK_PAYMENT_BUTTON_SERVICE`      | Нажал оплату разовой услуги                      | `services[].id`, `services[].name`           |
| `CLICK_PAYMENT_BUTTON_SUBSCRIPTION` | Нажал оплату абонемента                          | `subscription_id`^*^, `subscription_name`^*^ |
| `PAYMENT_COMPLETED_SUCCESSFULLY`    | Оплата прошла успешно                            | —                                            |
| `PAYMENT_FAILED`                    | Оплата не завершилась (ошибка / отказ / возврат) | —                                            |

### Авторизация

| Событие              | Что означает                |
| -------------------- | --------------------------- |
| `AUTH_PHONE_ENTERED` | Ввёл телефон и запросил SMS |
| `AUTH_CODE_ENTERED`  | Ввёл код из SMS             |
| `AUTH_SUCCESS`       | Успешно подтвердил телефон  |

^*^ — параметр может отсутствовать.

:::

:::tab
Эти события удобно собирать в воронку записи и оплаты. Особенно полезно сравнивать: **старт → выбор услуги → подтверждение телефона → оплата**.

### Открытие и закрытие

| Событие                  | Что означает                     |
| ------------------------ | -------------------------------- |
| `personal_widget_start`  | Виджет открылся в модальном окне |
| `personal_widget_closed` | Пользователь закрыл виджет       |

### Выбор услуги

| Событие                    | Что означает                                  |
| -------------------------- | --------------------------------------------- |
| `step_choose_the_services` | Открыт шаг выбора услуги                      |
| `choose_user_done`         | Выбрал услугу (передаём название и стоимость) |

### Выбор студии

| Событие              | Что означает                     |
| -------------------- | -------------------------------- |
| `step_studio_choice` | Открыт шаг выбора студии         |
| `studio_selected`    | Студия выбрана (передаём, какую) |

### Выбор даты и времени — с исполнителем

| Событие                                | Что означает                                   |
| -------------------------------------- | ---------------------------------------------- |
| `step_employee`                        | Открыт шаг выбора даты/времени с исполнителями |
| `employee_date_selected`               | Выбрал день                                    |
| `employee_time_selected_with_employee` | Выбрал время с исполнителем                    |

### Выбор даты и времени — без исполнителя

| Событие                        | Что означает                                    |
| ------------------------------ | ----------------------------------------------- |
| `step_without_employee`        | Открыт шаг выбора даты/времени без исполнителей |
| `withoutEmployee_dateselected` | Выбрал дату                                     |
| `withoutEmployee_timeSelected` | Выбрал время                                    |

### Финальное оформление и оплата

| Событие                  | Что означает                    |
| ------------------------ | ------------------------------- |
| `step_final`             | Открыт финальный шаг оформления |
| `final_check_phone`      | Ввёл телефон и запросил SMS     |
| `final_check_phone_done` | Успешно подтвердил номер        |
| `final_press_button_pay` | Нажал «Оплатить»                |
| `final_payment_success`  | Успешно оплатил запись          |
| `final_payment_fail`     | Вернулся без успешной оплаты    |

:::

::::

## Ограничение: «успешная оплата» может не сработать

:::callout{type="danger"}
Клиент оплатил и сразу закрыл сайт, не вернувшись в виджет. Из-за этого виджет не успевает передать в Метрику факт покупки — событие успешной оплаты не фиксируется.

:::

Для сверки продаж используйте отчёт по посещениям и UTM-меткам — он связывает оплату с рекламным источником, даже если «успешная оплата» в Метрику не пришла.

:::callout{type="tip"}
UTM для этих отчётов берутся не только из URL — если метки сохранены в cookie на сайте, виджет тоже их подхватит.

:::