- Как ставить правильно цель Яндекс метрики JavaScript событие на кнопку отправки формы Convert Forms.
- Как установить компонент ReReplacer
- Шаг 1 Указываем в настройках аддона name и id формы
- Где взять name и id формы?
- Шаг 2 Создаем цель в Яндекс метрике JS событие
- Шаг 3 - Прописываем в аддон номер метрики и данные идентификатора цели
- Что делать когда необходимо поставить несколько целей на несколько форм?
- Видеоинструкция
Разбираю функционал нового аддона JStart Target Metrika для установки целей Яндекс Метрики на формы компонента Convert Forms.
Как ставить правильно цель Яндекс метрики JavaScript событие на кнопку отправки формы Convert Forms.
Мы будем работать с компонентом который создает формы - Convert Forms
Почему Convert Forms?
Потому что у разных форм есть свои особенности. Наиболее удобный конструктор форм в связке с joomla по моему мнению Convert Forms. Поэтому в первую очередь мы сделали интеграцию аддона Replacer с Convert Forms чтобы можно было считать цели.
Что нам понадобится:
- Компонент ReReplacer от Regular Labs. Желательно последней версии.
- Аддон Replacer JStart Target Metrika (CF) v1.0.0
- Конструктор форм Convert Forms
Напоминаю, что все наши аддоны работают в связке с компонентом ReReplacer от Regular Labs.
Как установить компонент ReReplacer
Админ панель joomla 4 “Система” ❯ В разделе “Установка” нажимаем “Расширения” ❯ на вкладке “Загрузить и установить”, перетягиваем файл установщика в поле загрузки. Компонент установлен.
Установка аддона в компонент ReReplacer
Теперь надо зайти в компонент ReReplacer и установить аддон Replacer “ARJ_Add_JS_Target_Metrika_(CF)_v1.0.0.json”
Скачать аддон JStart Target Metrika (CF) v1.0.0
В левой части панели управления joomla, в разделе “Компоненты” кликаем по Regular Labs - ReReplacer. Откроется страница “ReReplacer: Элементы”.
Кликаем по кнопке “Импорт”.
Всплывет меню “Импортировать объекты”, кликаем по кнопке “Выберите файл” выбираем установщик аддона. Далее нажать кнопку Импорт.
После установки аддон будет уже опубликован.
После установки всего необходимого для работы нужно сделать три шага.
Шаг 1 Указываем в настройках аддона name и id формы
Кликаем по заголовку аддона, так мы попадем в его настройки.
Для того чтобы сработала цель на форме в поле “Поиск” надо указать name и id формы заменив значение - .*?
Код строки в которой надо указать name и id формы:
(<form name=".*?" id=".*?" [^\>]+>.*?)<button (type="submit" [^\>]+)>\s*(.*?)\s*</button>(.*?</form>)
Где взять name и id формы?
Эти данные берутся на вашем сайте из опубликованной формы через панель разработчика.
Открываем страницу с формой. Навели мышку на форму, кликаем правой кнопкой мыши ❯ посмотреть код. Нам откроется панель разработчика.
В открывшемся коде находим имя и id формы. Эти данные генерируются автоматически в Convert Forms. Их просто надо найти и скопировать. Далее прописываем в Аддоне в поле “Поиск”.
Пример:
Имя формы - cf2;
Id формы - сf2.
Код строки в которой указали name и id формы:
(<form name="cf2" id="cf2" [^\>]+>.*?)<button (type="submit" [^\>]+)>\s*(.*?)\s*</button>(.*?</form>)
Шаг 2 Создаем цель в Яндекс метрике JS событие
Нужно в яндекс метрике создать цель.
В сервисе Яндекс Метрика создаем цель. Нажимаем на кнопку “Добавить цель”
Пишем название цели
Тип условия* - выбрать “JavaScript событие”
Идентификатор цели - например kontakt.
! Важно идентификатор цели писать на английском языке.
После заполнения поля “Идентификатор цели” появится поле “Код цели для сайта” он будет состоять из номера метрики и названия идентификатора.
Нажимаем на кнопку “Добавить цель”
Для шага № 3 Вам понадобятся:
Номер созданной метрики и название идентификатора.
Шаг 3 - Прописываем в аддон номер метрики и данные идентификатора цели
Возвращаемся в настройки аддона ARJ_Add_JS_Target_Metrika_(CF)_v1.0.0
В поле “Замена” надо указать код цели для сайта из настроек цели в Я.Метрике
Строка кода по умолчанию.
\1<button onclick="ym(XXXXXX, 'reachGoal', 'TARGET_NAME'); return true;" \2>\3</button>\4
Строка кода с прописанным номером метрики и идентификатора.
\1<button onclick="ym(89459718, 'reachGoal', 'kontakt'); return true;" \2>\3</button>\4
Осталось только сохранить и закрыть.
Подпишись на Telegram канал "Goncharoff.pro сайты"
Рассказываю про сайты, продажи, работу с клиентами. Очень много авторского контента, лайфхаков и новых фич!
Что делать когда необходимо поставить несколько целей на несколько форм?
Например, у Вас на сайте пять форм и по каждой форме надо собрать статистику.
- Создаем для каждой формы свою цель в Яндекс метрике. Если пять форм, то создаем пять целей.
- Дальше надо продублировать аддон и настроить его под каждую форму. Опубликовать. Настраиваем аддон выполняя шаги 1,2,3.
Рекомендую сразу менять название заголовка в аддоне под каждую цель.