Наверх

Подписка на события виджетов

Содержание

 

 

 

Общая информация

Помимо отправки данных в Google Analytics и Яндекс Метрику, вы можете получать расширенные данные по виджетам напрямую с вашего сайта. Ниже описывается схема подключения отслеживания событий виджета.

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

 

Подписка на события

Формат события

Для получения событий от виджетов, необходимо добавить в объект window функцию. Пример:

window.ct('modules', 'widgets', 'subscribeToEvent', subsribeSettings)[{
   object: <string>
action: <string>
callback: <callback>
}
...
]

Где параметр subsribeSettings является массивом объектов (событий), которые имеют следующую структуру:

  • object: <string> // строка, обозначающая элемент, с которым произошло событие. Возможные варианты: 'module', 'button', 'form', 'dialog', 'request', 'multi-button'
  • action: <string> // строка, обозначающая  действие, которое произошло с объектом. Возможные варианты: 'loaded', 'show', 'close', 'create', 'fail', 'click', 'open'
  • callback: <callback> // строка, обозначающая функцию обратного вызова. 

Функция обратного вызова имеет вид:

function(event) {}

где event это объект  вида:

{
object: <string>
action: <string>
data: <object|null>
}

 

Объекты виджетов

Модуль (module)

Типы виджетов, на которых может возникать событие:

Действия:

  • show - показ кнопки
  • loaded - загрузка завершена

Данные по событию:

  • siteId - идентификатор сайта, виджет которого сработал
  • sessionId - идентификатор сессии, в рамках которой произошло событие
  • actionType - тип действия, может принимать одно из 2 значений
    • manual - действие произведено пользователем
    • auto - действие произведено автоматически (по таймеру или автоматически происходит при загрузке в соответствии с настройками виджета)
  • isMobile - флаг, мобильное ли устройство, на котором произошло событие
  • isMultiButton - флаг, был ли виджет, над объектом которого было произведено действие , в составе мультикнопки

Кнопка виджета (button)

Типы виджетов, на которых может возникать событие:

Действия:

  • click - клик по кнопке

Данные по событию:

  • widgetId - идентификатор виджета, над объектом которого было произведено действие 
  • widgetType - тип виджета, над объектом которого было произведено действие 
  • siteId - идентификатор сайта, виджет которого сработал
  • sessionId - идентификатор сессии, в рамках которой произошло событие
  • workMode - режим работы виджета, может принимать одно из 2 значений
    • working_hours - рабочее время
    • non_working_hours - нерабочее время
  • actionType - тип действия, может принимать одно из 2 значений
    • manual - действие произведено пользователем
    • auto - действие произведено автоматически (по таймеру или автоматически происходит при загрузке в соответствии с наcтройками виджета)
  • isMobile - флаг, мобильное ли устройство, на котором произошло событие
  • isMultiButton - флаг, был ли виджет, над объектом которого было произведено действие , в составе мультикнопки

 

Всплывающий диалог виджета (dialog)

Типы виджетов, на которых может возникать событие:

Действия:

  • show - показ всплывающего диалога
  • close - закрытие всплывающего диалога

Данные по событию:

  • widgetId - идентификатор виджета, над объектом которого было произведено действие 
  • widgetType - тип виджета, над объектом которого было произведено действие 
  • siteId - идентификатор сайта, виджет которого сработал
  • sessionId - идентификатор сессии, в рамках которой произошло событие
  • workMode - режим работы виджета, может принимать одно из 2 значений
    • working_hours - рабочее время
    • non_working_hours - нерабочее время
  • actionType - тип действия, может принимать одно из 2 значений
    • manual - действие произведено пользователем
    • auto - действие произведено автоматически (по таймеру или автоматически происходит при загрузке в соответствии с настройками виджета)
  • isMobile - флаг, мобильное ли устройство, на котором произошло событие
  • isMultiButton - флаг, был ли виджет, над объектом которого было произведено действие , в составе мультикнопки

 

Форма виджета (form)

Типы виджетов, на которых может возникать событие:

Действия:

  • show - показ формы
  • close - закрытие формы

Данные по событию:

  • widgetId - идентификатор виджета, над объектом которого было произведено действие 
  • widgetType - тип виджета, над объектом которого было произведено действие 
  • siteId - идентификатор сайта, виджет которого сработал
  • sessionId - идентификатор сессии, в рамках которой произошло событие
  • workMode - режим работы виджета, может принимать одно из 2 значений
    • working_hours - рабочее время
    • non_working_hours - нерабочее время
  • actionType - тип действия, может принимать одно из 2 значений
    • manual - действие произведено пользователем
    • auto - действие произведено автоматически (по таймеру или автоматически происходит при загрузке в соответствии с настройками виджета)
  • isMobile - флаг, мобильное ли устройство, на котором произошло событие
  • isMultiButton - флаг, был ли виджет, над объектом которого было произведено действие , в составе мультикнопки

 

Заявка с виджета (request)

Типы виджетов, на которых может возникать событие:

Действия:

  • create - заявка создана успешна
  • fail - в ходе отправки заявки произошла ошибка

Данные по событию:

  • widgetId - идентификатор виджета, над объектом которого было произведено действие 
  • widgetType - тип виджета, над объектом которого было произведено действие 
  • siteId - идентификатор сайта, виджет которого сработал
  • sessionId - идентификатор сессии, в рамках которой произошло событие
  • workMode - режим работы виджета, может принимать одно из 2 значений working_hours - рабочее время, non_working_hours - нерабочее время
  • actionType - тип действия, может принимать одно из 2 значений
    • manual - действие произведено пользователем
    • auto - действие произведено автоматически (по таймеру или автоматически происходит при загрузке в соответствии с настройками виджета)
  • isMobile - флаг, мобильное ли устройство, на котором произошло событие
  • isMultiButton - флаг, был ли виджет, над объектом которого было произведено действие , в составе мультикнопки
  • timePeriodType - тип временного периода, на которое заказана заявка, может принимать одно из 2 значений
    • now - выполнить сейчас
    • exact - выполнить в конкретное время
  • fields - массив пользовательских данных, введенных в форме.

 

Объекты мультикнопки

Кнопка мультикнопки (multi-button)

Действия:

  • open - открыт блок с кнопками виджета
  • close- закрыт блок с кнопками виджета

Данные по событию:

  • siteId - идентификатор сайта, виджет которого сработал

  • sessionId - идентификатор сессии, в рамках которой произошло событие

 

Примеры использования

Подписка на событие клика по кнопке виджета

Типовой скрипт подписки на событие клика по кнопке определенного типа виджета будет выглядеть так:

window.ct('modules', 'widgets', 'subscribeToEvent', [{
object: 'button', action: 'click', callback: function(event) { if (event.data.widgetType=='whatsapp-messenger'){ /*произвольный код, сработает по событию клика на кнопку виджета WhatsApp*/ } } }]);

 

Подписка на событие отправки формы

Если необходимо выполнить какой-либо скрипт или настроить цель по событию отправки формы, то можно воспользоваться примером:

window.ct('modules', 'widgets', 'subscribeToEvent', [{
object: 'request',
action: 'create',
callback: function(event){
if (event.data.widgetType=='promotion'){
/*произвольный код, сработает по событию отправки заявки виджета Промо*/
}
}
}]);

 

Подписка на разные события виджета

Если Вам необходима подписка на разные события, то достаточно вызвать функцию подписки только 1 раз. Например, если нужно подписаться на событие клика по кнопке виджета, а также на событие закрытия формы виджета, то скрипт будет выглядеть так:

window.ct('modules','widgets','subscribeToEvent',[{
object: 'button',
action: 'click',
callback: function(event){
/*произвольный код, сработает по событию клика*/
}},
{object: 'form',
action: 'close',
callback: function(event){
/*произвольный код, сработает по событию закрытия формы*/
}}
]);