Делаем цели Яндекс.Метрики для Contact Form7?

Добавить цель яндекс метрики contact form 7

Приветствую вас, дорогие друзья!

Сегодня я хотела бы вам рассказать об одной очень полезной и удобной функции Яндекс.Метрики, как использование целей для отслеживания работы форм обратной связи Contact Form 7 для WordPress.

Подключив формы Contact Form 7 в целях Яндекс.Метрики вы можете с легкостью отслеживать с каких форм обратной связи чаще всего отправляются заявки, а с каких вообще не отправляются. Проанализировав полученные данные, вы сможете внести правки в дизайн или структура сайта для увеличения количества заявок.

В этой статье я покажу вам как правильно подключить цели Яндекс.Метрики для Contact Form 7, так как с момента последнего обновления плагина, процедура подключения целей существенно поменялась.

Создание цели для Contact Form 7

Итак, для начала нам нужно создать цель в Яндекс.Метрике. Для этого у вас на сайте уже должен быть подключен скрипт счетчика посещаемости. Если вы еще этого не сделали, то инструкцию можно прочитать в этой статье:

Как узнать посещаемость сайта. Установка Яндекс.Метрики

Далее делаем следующее:

  1. 1.Заходим на сайт Яндекс.Метрики и авторизуемся.
  2. 2.На открывшейся странице со списком сайтов с подключенными счетчиками, кликаем указателем мышки по названию нужного нам сайта:
    Главная страница в Яндекс.Метрика
  3. 3.Далее, в меню выбираем пункт «Настройка»
    Добавляем цель яндекс метрики contact form 7
  4. 4.Переходим на вкладку «Цели» и нажимаем на кнопку «Добавить цель»:
    Вкладка цели яндекс.метрики
  5. 5.В открывшемся окошке задаем название цели и переходим на вкладку «JavaScript-событие», где нам нужно указать идентификатор данной цели. После того, как мы заполнили все поля, нажимаем на кнопку «Добавить цель»
    Настраиваем цель для Contact Form 7
  6. 6.После того как цель была добавлена нужно обязательно нажать на кнопку «Сохранить»:
    Сохраняем цели яндекс.метрики для contact form 7

Подключение цели Яндекс.Метрики в WordPress

После того, как мы создали цель в Яндекс.Метрике мы можем приступить к ее подключению в WordPress. Вот здесь, как раз и начинается самое интересное.

Дело в том, что раньше, для подключения цели в Contact Form 7 было достаточно дописать одну строку в окне редактирования формы, на вкладке «Дополнительные настройки».

Старое подключение целей для Contact Form 7

Теперь же, с момента обновления плагина до версии 4.9 такой вариант подключения цели не работает. При попытке использовать старый вариант подключения вы получите вот такой результат:

Ошибка при подключении целей яндекс.метрики для contact form 7

Выход из положения можно найти, порывшись в справочной документации, которую можно найти, перейдя по ссылке возле надписи «Используются устаревшие настройки».

Теперь, для подключения целей для Contact Form 7 нужно сделать следующее:

  1. 1.Открываем файл functions.php, который находится в корневой папке активной темы.
  2. 2.Пролистываем в самый конец файла и добавляем следующий фрагмент кода:

  3. 3.Здесь, в этом фрагменте кода, нужно внести свои изменения, в соответствии с вашими данными:
    Код для подключения целей для Contact Form 7
    1. 1.)Там где в одинарных кавычках указано число ’22’ – это идентификатор подключаемой формы. Здесь вы должны вставить ID вашей формы, который можно посмотреть в админпанели сайта, на странице «Contact Form 7» => «Контактные формы»
      Как посмотреть идентификатор формы Contact Form 7?
    2. 2.)В строке «yaCounter46469931.reachGoal(‘consult’);» заменяем числовое значение (идентификатор счетчика Яндекс.Метрики) на свое. Идентификатор счетчика вы можете посмотреть в настройках Яндекс.Метрики на вкладке «Основное» или в коде счетчика:
      Где найти идентификатор Яндекс.Метрики
    3. 3.)В строке «yaCounter46469931.reachGoal(‘consult’);» заменяем идентификатор цели (‘consult’) на свой.
  4. 4.Далее, нам остается только сохранить файл и дождаться обновления информации на странице сайта Яндекс.Метрики «Конверсии»
    Где посмотреть цели Яндекс.Метрики
    Страница "Конверсии"

Надеюсь у меня получилось максимально подробно описать подключение целей Яндекс.Метрики для форм Contact Form 7. Если у вас возникнут какие-то сложности или вопросы, вы можете задать их в комментариях.

Если эта статья была для вас полезной, не забудьте подписаться на мою рассылку и поделиться статьей в социальных сетях.

А на сегодня у меня все. До встречи в следующих статьях.

С уважением Юлия Гусарь

Подписаться на рассылку

Читайте также:

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

  1. Юлия, добрый день

    А можно как-то настроить отслеживание конверсии в заявки с определенных utm-меток?

    Т.е. приходит например с рекламы посетитель, смотрит сайт, потом на одной из страниц тыцает на форму, отправляет. Вопрос: можно ли в Метрике или в Гугл Аналитике отследить что эта заявки пришла с рекламы?

  2. Все сделал, но в доп. настройках плагина все равно высвечивается ошибка.

  3. А перед кодом

     

    add_action( ‘wp_footer’, ‘mycustom_wp_footer’ );

     

    function mycustom_wp_footer() {

    ?>

     

    Случайно не надо добавить «<?php» ?

     

    Если перед этим файл функшнс кончается на

    ‘after_page_number’ => » // строка после цифры

    ));

    }

    ?>

    например.

    ?

    • Можно вставить код перед знаком ?>
      Или, если Вам так удобнее, поставить вначале кода < ?php а в конце ?>

  4. Добрый день, я повторюсь с вопросом: если у меня 10 целей то как тогда быть ?

    • Здравствуйте! В этом случае вставляете код, указанный в статье, а далее дублируете код, отмеченный на скриншоте, столько раз сколько нужно, при этом заменяя идентификаторы формы, цели и счётчика на свои.
      Скриншот: http://prntscr.com/j7jgqp

  5. Благодарю за детальную инструкцию! )

    • Спасибо за Ваш комментарий!

  6. спасибо добрый человек! все работает!

    • И Вам спасибо! Удачи Вам!

  7. После того как все действия будут сделаны, ошибки в форме » Обнаружена 1 ошибка в конфигурации» исчезнуть должна?

    • Да, должна. Вы ведь убрали тот код что был на вкладке «Дополнительные настройки»?

      • Нет, не убрали. Надо убрать? :)

  8. Юлия, спасибо, все работает!

  9. Здравствуйте, подскажите пожалуйста, я вообще правильно вставил код в раздел дополнительные настройки? ) У меня не работает, прошу помощи.

     

     

    Скрин https://pp.userapi.com/c845418/v845418905/a3bfe/HFqhUFaAhDA.jpg

    • Этот код нужно вставлять в файл functions.php Вашей темы, а не в «Дополнительные настройки»!

  10. Я разобрался, что в корне файлов файл functions.php — но любые изменения делают сайт не доступным т.к. пишет ошибка в коде… я все перепробовал

    • Посмотрите нет ли у Вас в конце этого файла лишних пустых строк или знака ?>
      Код нужно вставлять перед закрытием ?>

  11. Подскажите, у меня несколько целей, в вожу ниже указанный код, сайт перестает работать. Если ввожу код на одну цел все работает. Подскажите где ошибка. Благодарю

    }

     

    add_action( ‘wp_footer’, ‘mycustom_wp_footer’ );

     

    function mycustom_wp_footer() {

    ?>

    <script type=»text/javascript»>

    document.addEventListener( ‘wpcf7mailsent’, function( event ) {

    if ( ’12’ == event.detail.contactFormId ) {

    yaCounter22985389.reachGoal(‘callback’);

    }

    }, false );

     

    </script>

    <?php

    }

     

    add_action( ‘wp_footer’, ‘mycustom_wp_footer’ );

     

    function mycustom_wp_footer() {

    ?>

    <script type=»text/javascript»>

    document.addEventListener( ‘wpcf7mailsent’, function( event ) {

    if ( ’62’ == event.detail.contactFormId ) {

    yaCounter22985389.reachGoal(‘Feedback’);

    }

    }, false );

     

    </script>

    <?php

    }

  12. Спасибо, огромное!//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_good.gif

    Почему-то все, кто освещает эту тему, только повторяют  справочную информацию! 2 дня искал решение проблемы! Все работает!//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_yahoo.gif

    Помогите, пожалуйста, решить следующую!

    Заметил, что у меня много посещений 0:00 сек времени.

    В службе поддержки ответили так:

    Дело в том, что в коде счётчика, установленном на сайте, у параметра accurateTrackBounce стоит значение false. При таком значении параметры точный показатель отказов отключен. Для исправления ситуации рекомендуем установить значение true, подробнее https://yandex.ru/support/metrika/code/counter-initialize.html.

    Как это сделать?

    Спасибо!

    • Здравствуйте, Алексей!
      Откройте код Вашего счётчика, который Вы вставляли на сайт, найдите там параметр «accurateTrackBounce» и вместо значения false вставьте true.

  13. Здравствуйте. А не подскажете как настроить цели яндекс, если формы сделаны в WPForms?

  14. Здравствуйте, Юлия, по вашей инструкции все сделала, вставила код в functions.php , но счетчик не срабатывает, к сожалению :(

    http://joxi.ru/LmG9YVNfedKyGA

  15. Юлия, спасибо

    теперь всё работает

    • Отлично! Спасибо за комментарий!

  16. помогите плз если не сложно.

    если я вставляю код, который вы выше написали, сайт перестает грузится. в чем ошибка?

    <?php

    /**

    * Функции шаблона (function.php)

    * @package WordPress

    * @subpackage birja

    */

     

    add_theme_support(‘title-tag’);

     

    register_nav_menus(array(

    ‘top’ => ‘Верхнее’,

    ‘bottom’ => ‘Внизу’,

    ‘vnutri’ => ‘Внутри сайта’

    ));

     

    add_theme_support(‘post-thumbnails’);

    set_post_thumbnail_size(250, 150);

    add_image_size(‘big-thumb’, 400, 400, true);

     

    register_sidebar(array(

    ‘name’ => ‘Сайдбар’,

    ‘id’ => «sidebar»,

    ‘description’ => ‘Обычная колонка в сайдбаре’,

    ‘before_widget’ => ‘<div id=»%1$s» class=»widget %2$s»>’,

    ‘after_widget’ => «</div>\n»,

    ‘before_title’ => ‘<span class=»widgettitle»>’,

    ‘after_title’ => «</span>\n»,

    ));

     

     

    function true_register_wp_sidebars() {

     

    /* В боковой колонке — первый сайдбар */

    register_sidebar(

    array(

    ‘id’ => ‘true_side’, // уникальный id

    ‘name’ => ‘Топ панель’, // название сайдбара

    ‘description’ => ‘Перетащите сюда виджеты, чтобы добавить их в сайдбар.’, // описание

    ‘before_widget’ => ‘<div id=»%1$s» class=»side widget %2$s»>’, // по умолчанию виджеты выводятся <li>-списком

    ‘after_widget’ => ‘</div>’,

    ‘before_title’ => ‘<h3 class=»widget-title»>’, // по умолчанию заголовки виджетов в <h2>

    ‘after_title’ => ‘</h3>’

    )

    );

    register_sidebar(

    array(

    ‘id’ => ‘true_side_mobile’, // уникальный id

    ‘name’ => ‘Топ панель мобилка’, // название сайдбара

    ‘description’ => ‘Перетащите сюда виджеты, чтобы добавить их в сайдбар.’, // описание

    ‘before_widget’ => ‘<div id=»%1$s» class=»side widget %2$s»>’, // по умолчанию виджеты выводятся <li>-списком

    ‘after_widget’ => ‘</div>’,

    ‘before_title’ => ‘<h3 class=»widget-title»>’, // по умолчанию заголовки виджетов в <h2>

    ‘after_title’ => ‘</h3>’

    )

    );

    }

     

    add_action( ‘widgets_init’, ‘true_register_wp_sidebars’ );

     

    if (!class_exists(‘clean_comments_constructor’)) {

    class clean_comments_constructor extends Walker_Comment {

    public function start_lvl( &$output, $depth = 0, $args = array()) {

    $output .= ‘<ul class=»children»>’ . «\n»;

    }

    public function end_lvl( &$output, $depth = 0, $args = array()) {

    $output .= «</ul><!— .children —>\n»;

    }

    protected function comment( $comment, $depth, $args ) {

    $classes = implode(‘ ‘, get_comment_class()).($comment->comment_author_email == get_the_author_meta(’email’) ? ‘ author-comment’ : »);

    echo ‘<li id=»comment-‘.get_comment_ID().'» class=»‘.$classes.’ media»>’.»\n»;

    echo ‘<div class=»media-left»>’.get_avatar($comment, 64, », get_comment_author(), array(‘class’ => ‘media-object’)).»</div>\n»;

    echo ‘<div class=»media-body»>’;

    echo ‘<span class=»meta media-heading»>Автор: ‘.get_comment_author().»\n»;

    //echo ‘ ‘.get_comment_author_email();

    echo ‘ ‘.get_comment_author_url();

    echo ‘ Добавлено ‘.get_comment_date(‘F j, Y в H:i’).»\n»;

    if ( ‘0’ == $comment->comment_approved ) echo ‘<br><em class=»comment-awaiting-moderation»>Ваш комментарий будет опубликован после проверки модератором.</em>’.»\n»;

    echo «</span>»;

    comment_text().»\n»;

    $reply_link_args = array(

    ‘depth’ => $depth,

    ‘reply_text’ => ‘Ответить’,

    ‘login_text’ => ‘Вы должны быть залогинены’

    );

    echo get_comment_reply_link(array_merge($args, $reply_link_args));

    echo ‘</div>’.»\n»;

    }

    public function end_el( &$output, $comment, $depth = 0, $args = array() ) {

    $output .= «</li><!— #comment-## —>\n»;

    }

    }

    }

     

    if (!function_exists(‘pagination’)) {

    function pagination() {

    global $wp_query;

    $big = 999999999;

    $links = paginate_links(array(

    ‘base’ => str_replace($big,’%#%’,esc_url(get_pagenum_link($big))),

    ‘format’ => ‘?paged=%#%’,

    ‘current’ => max(1, get_query_var(‘paged’)),

    ‘type’ => ‘array’,

    ‘prev_text’    => ‘Назад’,

    ‘next_text’    => ‘Вперед’,

    ‘total’ => $wp_query->max_num_pages,

    ‘show_all’     => false,

    ‘end_size’     => 15,

    ‘mid_size’     => 15,

    ‘add_args’     => false,

    ‘add_fragment’ => »,

    ‘before_page_number’ => »,

    ‘after_page_number’ => »

    ));

    if( is_array( $links ) ) {

    echo ‘<ul class=»pagination»>’;

    foreach ( $links as $link ) {

    if ( strpos( $link, ‘current’ ) !== false ) echo «<li class=’active’>$link</li>»;

    else echo «<li>$link</li>»;

    }

    echo ‘</ul>’;

    }

    }

    }

     

    add_action(‘wp_footer’, ‘add_scripts’);

    if (!function_exists(‘add_scripts’)) {

    function add_scripts() {

    if(is_admin()) return false;

    wp_deregister_script(‘jquery’);

    wp_enqueue_script(‘jquery’,’//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js’,»,»,true);

    wp_enqueue_script(‘bootstrap’, get_template_directory_uri().’/js/bootstrap.min.js’,»,»,true);

    wp_enqueue_script(‘main’, get_template_directory_uri().’/js/main.js’,»,»,true);

    }

    }

     

    add_action(‘wp_print_styles’, ‘add_styles’);

    if (!function_exists(‘add_styles’)) {

    function add_styles() {

    if(is_admin()) return false;

    wp_enqueue_style( ‘bs’, get_template_directory_uri().’/css/bootstrap.min.css’ );

    wp_enqueue_style( ‘main’, get_template_directory_uri().’/style.css’ );

    wp_enqueue_style( ‘main2′, get_template_directory_uri().’/css/calc.css?ver=1.2’ );

    }

    }

     

    if (!class_exists(‘bootstrap_menu’)) {

    class bootstrap_menu extends Walker_Nav_Menu {

    private $open_submenu_on_hover;

     

    function __construct($open_submenu_on_hover = true) {

    $this->open_submenu_on_hover = $open_submenu_on_hover;

    }

     

    function start_lvl(&$output, $depth = 0, $args = array()) {

    $output .= «\n<ul class=\»dropdown-menu\»>\n»;

    }

    function start_el(&$output, $item, $depth = 0, $args = array(), $id = 0) {

    $item_html = »;

    parent::start_el($item_html, $item, $depth, $args);

    if ( $item->is_dropdown && $depth === 0 ) {

    if (!$this->open_submenu_on_hover) $item_html = str_replace(‘<a’, ‘<a class=»dropdown-toggle» data-toggle=»dropdown» role=»button» aria-haspopup=»true» aria-expanded=»false»‘, $item_html);

    $item_html = str_replace(‘</a>’, ‘ <b class=»caret»></b></a>’, $item_html);

    }

    $output .= $item_html;

    }

    function display_element($element, &$children_elements, $max_depth, $depth = 0, $args, &$output) {

    if ( $element->current ) $element->classes[] = ‘active’;

    $element->is_dropdown = !empty( $children_elements[$element->ID] );

    if ( $element->is_dropdown ) {

    if ( $depth === 0 ) {

    $element->classes[] = ‘dropdown’;

    if ($this->open_submenu_on_hover) $element->classes[] = ‘show-on-hover’;

    } elseif ( $depth === 1 ) {

    $element->classes[] = ‘dropdown-submenu’;

    }

    }

    parent::display_element($element, $children_elements, $max_depth, $depth, $args, $output);

    }

    }

    }

     

    if (!function_exists(‘content_class_by_sidebar’)) {

    function content_class_by_sidebar() {

    if (is_active_sidebar( ‘sidebar’ )) {

    echo ‘col-sm-9’;

    } else {

    echo ‘col-sm-12’;

    }

    }

    }

     

    function menu_items_move_class_from_li_to_a( $atts, $item, $args ) {

    $class = $item->classes[0];

    if ( strpos($class, ‘menu-item’) === false ) {

    $atts[‘class’] = $class;

    }

    return $atts;

    }

    add_filter( ‘nav_menu_link_attributes’, ‘menu_items_move_class_from_li_to_a’, 10, 3 );

     

     

    function vComp(){

    get_template_part(‘calculator’);

    }

    add_shortcode( ‘vShortcode’, ‘vComp’ );

    add_action(‘acf/init’, ‘my_acf_init’);

     

    function my_acf_init() {

     

    if( function_exists(‘acf_add_options_page’) ) {

     

    $option_page = acf_add_options_page(array(

    ‘page_title’    => __(‘Общие настройки’, ‘my_text_domain’),

    ‘menu_title’    => __(‘Общее’, ‘my_text_domain’),

    ‘menu_slug’     => ‘theme-general-settings’,

    ));

     

    }

     

    }

     

    ?>

    add_action( ‘wp_footer’, ‘mycustom_wp_footer’ );

     

    function mycustom_wp_footer() {

    ?>

    <script type=»text/javascript»>

    document.addEventListener( ‘wpcf7mailsent’, function( event ) {

    if ( ’18’ == event.detail.contactFormId ) {

    yaCounter51293893.reachGoal(‘form1’);

    }

    }, false );

     

    </script>

    <?php

    }

    • Здравствуйте!
      Попробуйте предложенный в статье код вставить перед символом, показанным на скриншоте http://prntscr.com/loxb11
      Или вообще удалите выделенный на скриншоте символ. Попробуйте оба варианта.

  17. Здравствуйте, Юлия! очень понравилась ваша статья и помогла, до этого я трижды пыталась цель повесить  на контактную форму у себя на сайте! Спасибо вам за то, что пишите полезные статьи! буду читать вас дальше! Успехов вам!

    • Здравствуйте, Светлана! Спасибо за Ваш комментарий!
      Очень приятно :)

  18. Здравствуйте! Будет ли корректно работать данный код, если у меня создана одна цель и к ней я хочу подключить 4 контактные формы?

    add_action( ‘wp_footer’, ‘mycustom_wp_footer’ );

     

    function mycustom_wp_footer() {

    ?>

    <script type=»text/javascript»>

    document.addEventListener( ‘wpcf7mailsent’, function( event ) {

    if ( ‘1998’ == event.detail.contactFormId ) {

    yaCounter51252211.reachGoal(‘ORDER’);

    }

    if ( ‘1774’ == event.detail.contactFormId ) {

    yaCounter51252211.reachGoal(‘ORDER’);

    }

    if ( ‘1990’ == event.detail.contactFormId ) {

    yaCounter51252211.reachGoal(‘ORDER’);

    }

    if ( ‘1833’ == event.detail.contactFormId ) {

    yaCounter51252211.reachGoal(‘ORDER’);

    }

    }, false );

    </script>

    <?php

    }

  19. Здравствуйте!

    Как добавить с помощью кода несколько целей? У меня 20 форм заявок.

    • Здравствуйте! Нужно будет повторять предложенный фрагмент кода меняя идентификатор формы и идентификатор цели.

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *

//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_bye.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_good.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_negative.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_scratch.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_wacko.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_yahoo.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_cool.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_heart.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_rose.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_smile.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_whistle3.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_yes.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_cry.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_mail.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_sad.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_unsure.gif 
//impuls-web.ru/wp-content/plugins/wp-monalisa/icons/wpml_wink.gif