Если вас по каким-то причинам не устраивают автоцели в Яндекс Метрике и необходимо настроить цель отправка формы, созданной плагином Contact Form 7 или у вас на сайте скрипт для старой версии Метрики и цель не отображается в отчете, то наша инструкция позволит быстро решить этот вопрос.
Добавление цели в аккаунте Яндекс Метрика мы рассматривать не будем, для этого есть подробная инструкция в справке. Поэтому сразу переходим к самому скрипту:
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
if('YYYY' == event.detail.contactFormId){
ym(XXXXXXXX,'reachGoal','partnerstvo');
}
if('YYYY' == event.detail.contactFormId){
ym(XXXXXXXX,'reachGoal','callback');
}
}, false );
</script>
где ym(XXXXXXXX,'reachGoal','callback')
и ym(XXXXXXXX,'reachGoal','partnerstvo')
- это коды полученные при создании JS целей в аккаунте Яндекс Метрики. YYYY - ID форм.
Данный пример отслеживает отправку двух разных форм CF7, соответственно это две разные цели. Сам код размещается в файле footer.php до тега </body>, также его можно разместить в файле function.php активной темы, но с использованием функции wp_footer
Важно отметить, что данный скрипт совершенно рабочий, если корректно указаны ID форм.
Как же получить ID формы, созданной в Contact Form 7
Есть 2 варианта: посложнее и попроще.
Вариант 1.
Размещаем следующий скрипт
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
alert( event.detail.contactFormId );
}, false );
</script>
далее делаем тестовую отправку формы и во всплывающем окне получим ID соответствующей формы.
Вариант 2.
В админке сайта переходим к списку форм и наводим указатель мыши на название формы. Слева внизу окна браузера появится ссылка на редактирование, после знака "=" указан ID формы. При переходе к редактированию формы, ID берется из url адреса в строке браузера. Не используйте ID которые выводятся в шорткоде форм (на рис. перечеркнуто) - скрипт с такими ID работать не будет.
Проверка цели
А теперь осталось проверить всё ли корректно у нас работает. Для этого к адресу страницы где размещена форма добавляем параметр ?_ym_debug=2
, загружаем страницу и справа внизу окна браузера видим кнопку панели проверки цели.
Нажимаем кнопку, на открывшейся панели выбираем вкладку Events, проводим тестовую отправку формы. В поле Goal reach: мы должны увидить соответствующий форме идентификатор цели. Если этой строки нет, проверяйте корректность кода и ID формы.