Timerl@n

Contact Form 7. Установка целей Метрики и Analytics

С версии 4.7 плагина «Contact Form 7» доступны следующие события:

  • wpcf7mailsent — успешная отправка формы;
  • wpcf7invalid — имеются поля с недопустимыми данными;
  • wpcf7spam — подозрение на спам;
  • wpcf7mailfailed — проблема с доставкой;
  • wpcf7submit — передача формы без проверок.

 

Для их отслеживания осуществляется через HTML DOM Method — addEventListener().

Пример для отслеживания успешной отправки формы

document.addEventListener( 'wpcf7mailsent', function( event ) {
  /*--- код выполняемый при генерации события---*/
}, false );

Код из примера подойдет если форма на странице одна, а если их больше?

CF7. Пример нескольких форм

Для каждой формы CF7 задается уникальный id и по нему мы можем отслеживать события заполнения конкретных форм.

Для этого создадим функцию в которой будем генерировать события цели.

function reachGoalMetrics(goal){
  try{yaCounterXXXXX.reachGoal(goal);} catch(e){}
  try{ga('send', 'event', goal);} catch(e){}
}

Теперь в зависимости формы генерируем события целей Я.Метрики и Google Analytics.

document.addEventListener( 'wpcf7mailsent', function( event ) {

  var formID = (event.detail.contactFormId != "")? event.detail.contactFormId : false;

  if(formID != false){

    switch(formID){
      case '59':reachGoalMetrics("Target1");break;
      case '349':reachGoalMetrics("Target2");break;
      case '60':reachGoalMetrics("Target3");break;
      default: break;
    }
  }

}, false );

 

Теперь после успешного заполнения форм на сайте будут срабатывать соответствующие цели.

Если цели не срабатывают, необходимо посмотреть содержимое event.detail. Возможно в других версиях CF7 другая структура данных.

Если решение помогло, напиши в комментариях. Тебе не сложно, мне приятно:)

 

Код целиком:

function reachGoalMetrics(goal){
  try{yaCounterXXXXX.reachGoal(goal);} catch(e){}
  try{ga('send', 'event', goal);} catch(e){}
}

document.addEventListener( 'wpcf7mailsent', function( event ) {

  var formID = (event.detail.contactFormId != "")? event.detail.contactFormId : false;

  if(formID != false){

    switch(formID){
      case '59':reachGoalMetrics("Target1");break;
      case '349':reachGoalMetrics("Target2");break;
      case '60':reachGoalMetrics("Target3");break;
      default: break;
    }
  }

}, false );

 

 

 

Поделиться в соц. сетях

Опубликовать в Google Plus
Опубликовать в Facebook
Опубликовать в Одноклассники

Categorised as: Заметка


4 комментария

  1. AlexKn:

    Здравствуйте!
    Подскажите как сделать так, что бы после отправки сообщения через форму пользователя переадресовывало на другую страницу (благодарности например), раньше делал через on_sent_ok: «», сейчас не получается…

    • Timerlan:

      Можно после проверки if(formID != false)
      поставить редирект js
      через location.replace(«Адрес куда переадресовывать»);

  2. Александр:

    Здравствуйте, куда вставлять это весь код?

    • Timerlan:

      Код необходимо разместить в подвал шаблона сайта footer.php или в файл скриптов сайта.

Добавить комментарий

Ваш адрес email не будет опубликован.

*