Яндекс.Метрика и Цели

Последние изменения: 06.04.2022
044369c8eb222250fd7517c9cb195ffe.png

1. Настройка счетчика
2. Установка кода счетчика на лендинг
3. Просмотр и анализ собранных данных
4. Настройка и установка целей Яндекс.Метрики
4.1. Как настроить цель Метрики?
4.2. Настройка целей для статичных лид-форм
4.3. Настройка целей для нескольких лид-форм
4.4. Настройка целей для кликов по ссылкам и кнопкам
4.5. Настройка целей для попап-форм

Метрика — это бесплатный сервис от Яндекс, предназначенный для оценки ключевых показателей эффективности веб-страниц, анализа поведения online посетителей, эффективности рекламных кампаний и входящего SEO-трафика.

Платформа LPgenerator предоставляет всю необходимую статистику для качественной работы и оптимизации посадочных страниц, но если для вас принципиально использовать аналитику от Яндекс, то вашему вниманию предлагается подробное руководство.

 

Шаг 1. Настройка счетчика

Для этого:

1. Откройте страницу по ссылке: https://metrika.yandex.ru/, а затем кликните по кнопке «Перейти»:

9add31649cf938627ff802a42ae14ef2.png

Введите данные вашей учетной записи в Яндекс (логин и пароль совпадают с учетными данными Яндекс.Почты и прочих сервисов Яндекс).

Если у Вас нет аккаунта, нажмите кнопку «Регистрация»:

0570ed96ed7285d11fc036d8fd2ef515.png

2. После входа в метрику, нажмите «Добавить счетчик»:

91f33e2620674a9b339ab05c5ce0640f.png

3. Далее задайте имя для счетчика, а в поле «Адрес сайта» введите название домена, на котором находится ваш лендинг.

Обратите внимание:

  • Вводить адрес нужно с www;

  • Отметьте галочкой опцию «Принимать данные только с указанных адресов». Это позволит не учитывать просмотры страницы, когда она открыта в режиме предпросмотра из редактора LPgenerator.

В итоге должно получится следующее:

979ba1fbfaa27b640c51a9630bc4e114.png

4. Поставьте галочку «Я принимаю условия Пользовательского соглашения» и нажмите «Создать счетчик»:

6bc68fc43c9ab0d1c22e4e72e7cc6b48.png

Вам будет показан код счетчика метрики — данный этап можно пропустить, к установке кода счетчика мы вернемся позже. Нажмите на кнопку «Начать пользоваться»:

776aad3726d0f4063517654d80a0f657.png

5. Кликните по только что созданному счетчику:

e5c02c25531b63e7c7e50d69fcc0b754.png

6. На панели слева выберите раздел «Настройка»:

4e78666ad2e47c7b1185eb777ae51242.png

На вкладке «Счетчик» можно задать необходимые настройки счетчика перед установкой его кода на страницу:

3eefd06eff6aff38ae4ff3eeb3ed7733.png

Нажмите на кнопку «Дополнительные настройки» и отметьте галочками функции, которые будете использовать.

842b4b93f4aff60ef368dc46b4db871a.png

Отдельных пояснений требует настройка инструмента «Вебвизор»:

  • Вебвизор записывает поведение посетителей страницы. Для использования данного инструмента, необходимо активировать его на вкладке «Вебвизор». По умолчанию он выключен и записывать данные не будет.

Выберите способ записи содержимого вебвизора:

  • Из браузера: код счетчика берет содержимое уже загруженной страницы непосредственно из браузера посетителя. Этот вариант менее ресурсоемок, но содержимое страницы может записаться с искажениями;

  • Отдельным запросом: код счетчика осуществляет отдельную загрузку страницы во время ее просмотра посетителем и отправляет ее содержимое в Метрику. Этот вариант позволяет записывать более точную копию того, что видел посетитель, но создает дополнительную нагрузку на сайт.

Впишите адрес лендинга с www.

Остальные настройки можно оставить по умолчанию.

57dca23abce3293ea7dfd15dadd6b7cb.png

Для справки:

  • Настройка «От имени анонимного посетителя» означает, что в плеер будет загружаться такая же страница, какую увидел бы новый посетитель, впервые пришедший на сайт.

Не забудьте сохранить настройки:

7fcf0f01cdb6a34ab9c1a4827cd2380d.png

Для повышения качества записей вы можете включить новую версию вебвизора «Вебвизор 2.0». В этом случае дополнительной настройки вебвизора производить не нужно, а включить его можно в один клик:

79eb30358c7f7717b02bf96a21656555.png

Сохраните сделанные изменения:

be28e85e564d025323343aef5f604dad.png

 

Шаг 2. Установка кода на лендинг

Используйте данный код на всех лендингах, для которых вы хотите учитывать статистику.

Посадочные страницы должны находится на одном домене. Например: если www.testmetrika.ru — домен, то страницы должны иметь название www.testmetrika.ru/название страницы/.

Итак, после настроек параметров счетчика вам нужно скопировать сгенерированный код в разделе «Настройка» — «Счетчик».

Прокрутите страницу чуть ниже и затем кликните на кнопку «Скопировать»:

8519a7633c254f8553d240e6ab0f4f3a.png

Перейдите в редактор вашего лендинга и выберите инструмент «Скрипты»:

71b9a9d3cee874901bbc0009ffbab33e.png

Код счетчика потребуется установить в положение «Внутри тега <HEAD>»:

3e3a335d10c7ccfdbdf5dfbde818dd40.png

Обратите внимание:

  • Данные по вашему лендингу начнут отображаться не сразу после установки кода счетчика. На обновление кэша Яндекс порой требуется несколько часов. Особенно это касается данных Вебвизора;

  • После внесения изменений в настройки Метрики счетчик нужно пересохранять, а его код копировать и добавлять на лендинг заново.

Шаг 3. Просмотр и анализ собранных данных

1. Для того чтобы начать работать со счетчиком, кликните по нему:

b5a24515522aa725d3051a8cd5a3af9b.png

Обратите внимание, иконка статуса счетчика должна быть зеленой. Это означает, что боты Яндекс могут посещать лендинг.

Если иконка подсвечена красным:

  • Проверьте наличие кода счетчика на посадочной странице (не забудьте сохранить лендинг после добавления кода);

  • Проверьте наличие www в адресе домена в настройках счетчика;

  • Подождите некоторое время, статус счетчика обновляется не сразу.

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

2. Кликните по названию счетчика. Откроется сводка статистики за определенный период.

599f6336048bd545f01692e0286d36d0.png

Здесь также можно выбрать период для отображения статистики:

bdb3a54bbdf8157d652ddc9a7722d0c7.png

В метрике доступно множество отчетов, в которых можно увидеть различные статистические данные, собранные роботами Яндекс.

Отдельно вынесена информация по записям Вебвизора:

b8d8f5d0767387547442d3a347e39cf7.png

При попытке просмотреть записи вы можете увидеть сообщение: «Нет данных с выбранными условиями или вебвизор не подключен в настройках счетчика».

Причины может быть две:

  • Данные о посещениях еще не загрузились — для загрузки данных вебвизора иногда требуется несколько часов;

  • Вебвизор не включен и не отмечен в настройках счетчика.

Возвращаемся в настройки счетчика и проверяем параметры вебвизора. Напомним, должен быть выбран способ «Из браузера» либо «Отдельным запросом».

d5bbc68a1724eb747e718eb7fde4f941.png

Если настройки корректны, то необходимо подождать несколько часов — данные должны загрузиться. В противном случае рекомендуем обратиться в нашу службу технической поддержки по адресу support@lpgenerator.ru — мы проверим, в чем может заключаться проблема.

3. Если же все в порядке, то вы увидите список записей. Нажмите «Воспроизвести посещение», чтобы увидеть, какие действия посетитель производил на странице.

f0e927edc57f536f919a8980155855f6.png

 

Шаг 4. Настройка и установка целей Яндекс.Метрики

Итак, с основными инструментами мы разобрались, теперь поговорим о настройке целей.

Цель — это желаемый результат проведения рекламной кампании, событие на лендинге, которое является для вас индикатором успешности рекламной кампании (клик по кнопке, заполнение лид-формы или переход по ссылке).

Обратите внимание: цели на странице устанавливаются с помощью скриптов. В каждом из них есть участки, которые вам потребуется отредактировать в соответствии с настройками вашего счетчика и целей.

После строк, в которые необходимо внести правки, добавлен символ двойного слеша (//) и подсказка, что именно требуется сделать. Подсказки мы дополнительно отметили зеленым цветом. Будьте внимательны.

7ed5328907f9898e7d88d8e6019dfdc5.png

 Как настроить цель Метрики?

1. Зайдите в настройки счетчика и выберите раздел «Цели»:

46ac17cc4fc9de1c9a91362d4ea00cd7.png

2. Нажмите «Добавить цель»:

a69a596714c0d2bb8c4ff85a97ae9154.png

3. Перейдите во вкладку «JavaScript-событие». Введите название для цели (может быть любым и служит лишь для простоты поиска в общем списке).

0ce04e046efe386f911605bbd9efb867.png

4. Введите идентификатор цели латиницей. Именно его потребуется указать в скрипте.

6952f2f089d8cf2fcbf31cfb42046373.png

Внимание: для каждой цели должно быть задано уникальное название идентификатора

5. Нажмите кнопку «Добавить цель»:

0aee9e289bfa8680f37f88f7e73591fb.png

6. Сохраните изменения:

3d067263908c4a98795e99f0d2d03deb.png

 Настройка целей для статичных лид-форм

Обратите внимание: коды различаются в зависимости от результата формы (показ сообщения, переход по URL), по которой будете отслеживать цель.

Если  вы хотите, чтобы после отправки данных с лид-формы осуществлялся показ сообщения, то скопируйте этот код (коды для попап форм указаны ниже):

 
<!--Отслеживание цели Яндекс.Метрики для статичных лид-форм с показом сообщения-->
<script>
    jq_144('#block-newID').on('submit', '.our_form', function() {
        // block-newID - id формы
        var form = jq_144(this);
 
        jq_144('#lp_form_target').on('load', function() {
 
                if (!window.frames.lp_form_target.data_json ||
                    (window.frames.lp_form_target.data_json.length == 0)) {
                    yaCounterCOUNTER_ID.reachGoal('ORDER');
                    // ЗАМЕНИТЬ COUNTER_ID - номер вашего счетчика
                    // ЗАМЕНИТЬ ORDER - идентификатор вашей цели
                }
 
                timerNameID = setInterval(function(){
                    // timerNameID - id формы
                    if (jq_144('#form_submit_message').css('display') == 'block') {
                        clearInterval(timerNameID); // timerNameID - id формы
                    }
                }, 100);
        });
    });
</script>

Если вы хотите, чтобы после отправки данных с формы посетитель направлялся на страницу благодарности (или другую страницу), то скопируйте этот код (обратите внимание на строки со словом «ЗАМЕНИТЬ»):

 
<!--Отслеживание цели Яндекс.Метрики для статичных лид-форм с переходом на страницу 
благодарности-->
<script>
    jq_144('#block-newID').on('submit', '.our_form', function() {
        // block-newID - id формы
 
        var form = jq_144(this);
 
        jq_144('#lp_form_target').on('load', function() {
 
            if (!window.frames.lp_form_target.data_json ||
                (window.frames.lp_form_target.data_json.length == 0)) {
                yaCounterCOUNTER_ID.reachGoal('ORDER');
// ЗАМЕНИТЬ COUNTER_ID - номер счетчика
// ЗАМЕНИТЬ ORDER - идентификатор цели
            }
 
            timerNameID = setInterval(function() {
                if (jq_144('#form_submit_message').css('display') == 'block') {
                    clearInterval(timerNameID); 
           //timerNameID - номер id формы, например timerName10
                    document.location = 'http://myurl.com'; 
// ЗАМЕНИТЬ myurl.com на адрес вашей страницы благодарности
                }
            }, 1000);
        });
    });
</script>

Далее откройте в редакторе LPgenerator посадочную страницу, на которой будут отслеживаться цели. Установите результатом действия формы показ сообщения.

Внимание: вне зависимости от того, какой код вы будете использовать, результат действия формы, установленный в её свойствах должен быть именно такой:

337d1f7019eabbec52f1d9cd3d1ed096.png

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

1. Откройте лендинг в редакторе LPgenerator и выберите инструмент «Скрипты»:

f2d54a03617e6ac1eb04262396cce784.png

2. В открывшемся окне нажмите на кнопку «Добавить скрипт»:

a013453c507b5ce1334f5390ef10f49a.png

3. Вставьте скопированный код и задайте ему положение «Перед тегом </BODY>». Не забудьте назвать и сохранить скрипт.

543c020381978b0be2238c8524585071.png

В скрипте нужно изменить следующие параметры:

47c7a5e98ccb4f412228666b3cb523de.png

«#block-newID» — это идентификатор формы, для которой будет учитываться цель.

Идентификатор можно посмотреть в расширенных свойствах формы справа. Для этого кликните один раз по полям формы и на правой панели свойств в поле «ID якоря» скопируйте идентификатор формы:

812bef9a9e7e8dd370459e30b1c2516b.png

Меняем в коде:

f62709e23d8e2c414c88db0e923789c6.png

«COUNTER_ID» — номер вашего счетчика в Яндекс.Метрике. Посмотреть номер счетчика можно в его настройках:

59a239fac17264f79c82203b03793b43.png

Полностью меняем надпись «COUNTER_ID» в коде на номер счетчика:

5814bf1fa3f99f028ccb88e60c5f3a4c.png

«ORDER» — если у Вас одна цель и ее идентификатор ORDER (как указано в нашем примере), то переименовывать ее не нужно.

Идентификатор цели можно уточнить в настройках счетчика, в разделе «Цели»:

e5620ecddb4d43e73c28abcb600c507c.png

Меняем в коде. В нашем примере идентификатор цели «ORDER» в скрипте и счетчике совпадают:

abb18d123910a15c9f8fdc078907e29b.png

«timerNameID» — имя переменной таймера. Вместо ID укажите цифры из идентификатора Вашей формы.

bfe2c0dfc742e182ff9fe4738204fe82.png

5. Готово. Теперь если посетитель заполнит данные и отправит их через форму, в Яндекс.Метрике отобразится цель.

Статистические данные отображаются в «Стандартных отчетах», в разделе «Конверсии»:

5d881f919a4821a7666391c5ad13100e.png

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

Если через несколько часов данные так и не подтянутся, проверьте настройки и скрипты, еще раз внимательно прочитав предыдущие пункты. Если ошибки не найдете, напишите нам по адресу support@lpgenerator.ru.

 

Настройка целей для нескольких лид-форм

Обратите внимание: в Яндекс.Метрике количество созданных целей должно быть равно количеству лид-форм, статистику которых вы хотите отслеживать.

Для отслеживания одной цели с одной формы используется скрипт, описанный выше. Для того, чтобы отследить цель с еще одной формы, продублируйте скрипт и вставьте его «Перед тегом </BODY>». Замените в скрипте ID формы, номер счетчика и идентификатор цели (block-newID, COUNTER_ID, ORDER, timerNameID) так, как это было описано выше.

 

Настройка целей для кликов по ссылкам и кнопкам

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

Сразу поясним — принцип отслеживания кликов по элементам такой же: необходимо добавить в Яндекс.Метрике нужные цели, вставить новый скрипт, заменить в скрипте параметры (ID элемента, номер счетчика и идентификатор цели).

Информацию о том, где посмотреть номер счетчика и идентификатор цели, смотрите выше, в разделе «Шаг 4. Настройка и установка целей Яндекс.Метрики».

1. Итак, необходимо скопировать скрипт:

 
<!--Отслеживание цели для Метрики для клика по кнопке-->
<script>
      jq_144('#block-newID a').click(function() { //ИЗМЕНИТЬ ID ЭЛЕМЕНТА
      yaCounterCOUNTER_ID.reachGoal('ORDER'); // ЗАМЕНИТЬ НОМЕР СЧЕТЧИКА 
                                              // И ИДЕНТИФИКАТОР ЦЕЛИ
     });
</script>

2. Положение скрипта установить «Перед тегом </BODY>»:

fb1aebd123cf165fed9ecbda9493e12e.png

3. Меняем ID элемента, по которому будет отслеживаться статистика:

d54ecabccbd4b3ca349f116c2395452b.png

4. Указываем в скрипте номер вашего счетчика вместо «COUNTER_ID»:

db8575653a6c1a5b85f6d64773945170.png

5. Указываем идентификатор цели вместо «ORDER»:

7a8eb9376a24ddae68d9444fe7caf344.png

Если идентификатор вашей цели в Яндекс.Метрике называется «ORDER», то менять его в скрипте не нужно.

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

6. Сохраняем скрипт и лендинг. Обратите внимание: данные в Яндекс.Метрике могут отобразиться не сразу. Напоминаем, статистические данные целей отображаются в разделе «Отчеты» в подпункте «Конверсии»:

 

Настройка целей для попап-форм

Внимание: вне зависимости от того, какой код вы будете использовать, результат формы, установленный в её свойствах, должен быть именно такой:

15acb5f5527d2792154bc8bb8bfecde9.png

Если вы хотите, чтобы после отправки данных с лид-формы осуществлялся показ сообщения, то скопируйте этот код:

<span style="font-weight: 400;"><!--Отслеживание цели Метрики для попап форм с показом сообщения после заполнения-->
<script>
 jq_144(function ($) {
 $(document).ready(function () {
 $('#overlay-block-newID').on('submit', 'form', function () {
 // overlay-block-newID - ID заменить на ID формы,
 // если форма - block-new2, то значение - #overlay-block-new2
 var $form = $(this);
 var start = Date.now();
 timerName255 = setInterval(function () {
 // в timerName255 замените 255 на ID отслеживаемой формы
 // если форма block-new2, то переменная будет - timerName2
 var newTime = Date.now();
 if ($form.siblings('.confirmation').hasClass('show')) {
 yaCounterCOUNTER_ID.reachGoal('ORDER');
 // COUNTER_ID - номер счетчика.
 clearInterval(timerName255);
 // в timerName255 замените 255 на ID отслеживаемой формы
 } else if (newTime - start > 2000) {
 clearInterval(timerName255);
 // в timerName255 замените 255 на ID отслеживаемой формы
 }
 }, 100);
 });
 });
 });
</script></span>

 Далее откройте лендинг в редакторе LPgenerator. Нажмите инструмент «Скрипты»:

1a29b94c63172218c3c92cc3ca52316e.png

Добавьте новый скрипт, нажав на кнопку «Добавить скрипт»:

05894c1a487038ef2e970e40d6fd9036.png

Добавьте название и установите положение скрипта «Перед тегом </BODY>». Сохраните изменения.

facbf54394d3d6e5b2d4d0fec9c6a559.png

Затем в скрипте нужно изменить следующие параметры:

«#overlay-block-newID» — это идентификатор попап-формы, для которой будет учитываться цель.

Обратите внимание: для попап-форм к идентификатору обязательно нужно добавить значение «overlay-».

Идентификатор можно посмотреть в расширенных свойствах попап-формы справа. Для этого кликните один раз по кнопке вызова попап, и на правой панели свойств в поле «ID якоря» скопируйте идентификатор формы:

1b4452327aaf1834fb5d4d7c663624a8.png

Меняем в коде:

224a7e1ff25ed741abfad63fafc94397.png

«COUNTER_ID» — номер вашего счетчика в Яндекс.Метрике. Посмотреть номер счетчика можно в его настройках:

5272251fe969769ae193ff3c2beb403d.png

Полностью меняем надпись «COUNTER_ID» в коде на номер счетчика:

491a15f151227282c36642e7ec87b5d7.png

«ORDER» — если у Вас одна цель и ее идентификатор «ORDER» (как указано в нашем скрипте), то переименовывать ее не нужно.

Идентификатор цели уточните в настройках счетчика, в разделе «Цели»:

474c89c10efe7ede45164f5d9a1b3c94.png

Меняем в коде. В нашем скрипте идентификатор цели «ORDER». Если в Метрике идентификатор указан, как «ORDER1», то в коде, соответственно, должно быть указано значение «ORDER1».

2461ce8f19d7fa23b98c39a519cdc3f2.png

«timerNameID» — имя переменной таймера. Вместо ID укажите цифры из идентификатора Вашей попап-формы.

e99df01a684073160497fa2282d9289b.png

Готово! Осталось сохранить изменения в редакторе страницы.

Если  вы хотите, чтобы после отправки данных с лид-формы осуществлялся переход на страницу благодарности, то скопируйте этот код:

<!--Отслеживание цели Метрики для попап форм с переходом на стр.благодарности--> 
<script>
jq_144(function ($) {
  $(document).ready(function () { 
  $('#overlay-block-newID').on('submit', 'form', function () { 
  // overlay-block-newID - ID необходимо изменить на ID формы, 
  // если форма - block-new2, то значение - #overlay-block-new2  
  var $form = $(this); 
  var start = Date.now(); 
  timerName255 = setInterval(function () { 
  // в timerName255 замените 255 на ID отслеживаемой формы 
  // если форма block-new2, то переменная - timerName2 
  var newTime = Date.now(); 
  if ($form.siblings('.confirmation').hasClass('show')) { 
  yaCounterCOUNTER_ID.reachGoal('ORDER'); 
  // COUNTER_ID - номер счетчика. 
  $('#overlay-block-newID').hide(); 
  // overlay-block-newID - ID необходимо изменить на ID формы, 
  // если форма - block-new2, то значение - #overlay-block-new2 
  var secondsToRedirect = 1; 
  // время до перенаправления, в секундах. 

  timerToRedirect = setInterval(function () { 
  if (secondsToRedirect <= 0) { 
  clearInterval(timerToRedirect); 
  document.location = 'Адрес страницы'; 
  //адрес стр.благодарности, на который будет происходить переход 
  } 
  jq_144('#seconsLeft').text(secondsToRedirect); 
  secondsToRedirect--; 
  }, 1000 /*задержка между тиками отсчёта в миллисек .*/); 

  clearInterval(timerName255); 
  // в timerName255 замените 255 на ID отслеживаемой формы 
  } else if (newTime - start > 2000) { 
  clearInterval(timerName255); 
  // в timerName255 замените 255 на ID отслеживаемой формы 
  } 
  }, 100); 
  }); 
  }); 
  }); 
 </script>

Вставьте данный код так же, как и предыдущий (см. выше), в том же положении — «Перед тегом </BODY>».

В данном коде измените следующие параметры:

  • «#overlay-block-newID» — идентификатор попап-формы, для которой будет учитываться цель;

  • «COUNTER_ID» — номер вашего счетчика в Яндекс.Метрике;

  • «ORDER» — если у Вас одна цель и ее идентификатор «ORDER» (как указано в нашем скрипте), то переименовывать ее не нужно. Если в Метрике идентификатор указан, как «ORDER1», то в коде, соответственно, должно быть указано значение «ORDER1»;

  • «timerNameID» — имя переменной таймера. Вместо ID укажите цифры из идентификатора Вашей попап-формы.

Вместо «http://www.mysite.ru/thanks/» укажите адрес вашей страницы благодарности, на которую должен осуществляться переход.

940baec2d8ae110cfec1fd656e1d7ad9.png

Адрес должен быть вида: http://www.mysite.ru/thanks/, то есть ссылка на страницу, скопированная из адреса страницы в браузере:

afe786a1dc6956f90a60e137afda6396.png

Для кнопки запуска «Попап», в свойствах, результатом действия необходимо поставить — показ сообщения.

03d43e3db491936cf198162217346fd9.png

Обратите внимание: переход на страницу благодарности будет осуществляться при помощи кода.

Готово! Осталось сохранить изменения в редакторе лендинга.

На этом краткий обзор возможностей Яндекс.Метрики и алгоритма ее интеграции на посадочные страницы платформы LPgenerator можно считать завершенным. Надеемся, что данная информация была полезной для вас. По любым вопросам обращайтесь в службу техподдержки по адресу support@lpgenerator.ru.

С уважением,
команда LPgenerator

Помогла ли вам статья?