Настройка отслеживания сообщений об ошибке и успешной отправке контактной формы в Google Tag Manager


02.11.2017

Google Tag Manager постоянно расширяет свой функционал, совсем недавно выкатили новый тип триггера – Видимость (Visibility), позволяющий отследить изменения, появившиеся на отслеживаемой странице сайта. Например, с его помощь можно отследить появление сообщений об ошибке или успешной заполнении формы обратной связи, появление pop-up окна и многое другое.

В качестве примера, будем отслеживать появление сообщений после заполнения формы Contact Form7 на сайте.

Для начала создадим новый триггер. Выбираем его тип – Доступной элемента (Element Visibility)

Далее настраиваем его. В качестве метода выбора – Селектор CSS, куда вставляем класс отслеживаемого элемента. В моем случае, это сообщение об ошибке: “Одно или несколько полей содержат ошибочные данные. Пожалуйста, проверьте их и попробуйте ещё раз.”

И проводим настройку триггера.

После этого можем сохранить внесенные изменения и проверить реакцию тегменеджера на настройки. Как видим в поле Summary, после попытки отправить пустую форму появился новый элемент.

Теперь необходимо проверить класс сообщения успешной отправки формы. Для этого необходимо заполнить все обязательные поля и нажать “Отправить”. В режиме предпросмотра находим элемент gtm.elementVisibility, открываем его Data Layer.

Как видим классы у элемента с сообщением об ошибке и успехе разные.

 

Теперь необходимо использовать полученные классы элементов для дальнейшей настройки отслеживаний, поэтому возвращаемся в Google Tag Manager, где активируем переменную Click Classes.

И для дальнейшего удобства хорошо будет задать найденным классам элементов результат к чему они приводят. Для класса с ошибкой это будет error, для успешной отправки формы success. Для этого необходимо создать собственную переменную “Таблица поиска”.

После сохранения новая переменная должна появиться в режиме предпросмотра и показать актуальный статус.

Переходим к завершающему шагу настройки – создание событийного тега, который будет передавать в Analytics данные. В поле категория задаем пользовательское название категории, в поле действие – определяем созданную переменную. В качестве триггера активации выступает настроенный триггер “Доступность элемента”

После всех настроек проводим проверку в режиме реального времени.

Заключение: Настройка подобных оповещений может быть полезна в отслеживании того, насколько сложна ваша форма. Или же, когда необходимо отследить более точный результат, чем просто отправка формы или какое-либо другое взаимодействие с элементом, в виде подтверждающего сообщения.

Павел Усик Павел Усик Head of SEO

Сертифицированный специалист Google Adwords, Google Analytics. В компанию пришел в 2010 году.


""