Открыть главное меню

Goals: различия между версиями

м
Метки: визуальный редактор правка из мобильной версии правка с мобильного устройства
Строка 2: Строка 2:
  
  
= Общие положения =
+
=Общие положения=
  
 
Первоначально ознакомьтесь с документацией на странице https://yandex.ru/support/metrika/general/goal-js-event.html#js-event<br>
 
Первоначально ознакомьтесь с документацией на странице https://yandex.ru/support/metrika/general/goal-js-event.html#js-event<br>
 
Документация для новой версии кода Метрики (с 6.12.2018) доступна на странице https://yandex.ru/support/metrika/objects/reachgoal.html<br>
 
Документация для новой версии кода Метрики (с 6.12.2018) доступна на странице https://yandex.ru/support/metrika/objects/reachgoal.html<br>
 
Далее берем пример нижеуказанного кода, правим его и добавляем либо в инфоблок headScripts или в тот же инфоблок, где подключается метрика, например в sitefootinfo4, footer_copyright.<p>
 
Далее берем пример нижеуказанного кода, правим его и добавляем либо в инфоблок headScripts или в тот же инфоблок, где подключается метрика, например в sitefootinfo4, footer_copyright.<p>
<source lang=javascript>
+
<source lang="javascript">
 
<script>
 
<script>
 
$(document).ready(function(){
 
$(document).ready(function(){
Строка 17: Строка 17:
 
</source>
 
</source>
 
или
 
или
<source lang=javascript>
+
<source lang="javascript">
 
<script>
 
<script>
 
$(document).ready(function(){
 
$(document).ready(function(){
Строка 27: Строка 27:
 
</source>
 
</source>
 
Указываем submit, если нужно вызвать событие при отправке формы. Например, формы регистрации (т.е. где заполняются поля). В таком случае в качестве "#celector" указываем имя/id этой формы.  
 
Указываем submit, если нужно вызвать событие при отправке формы. Например, формы регистрации (т.е. где заполняются поля). В таком случае в качестве "#celector" указываем имя/id этой формы.  
Вот пример кода формы <source lang=javascript><form method="post" action="/?page=reg&switch_to_opt" NAME="form1" id="formRegWholesale"></source> поэтому будет "#formRegWholesale".
+
Вот пример кода формы <source lang="javascript"><form method="post" action="/?page=reg&switch_to_opt" NAME="form1" id="formRegWholesale"></source> поэтому будет "#formRegWholesale".
  
 
[[Файл:Выделение 999(019).jpg|900px]]
 
[[Файл:Выделение 999(019).jpg|900px]]
Строка 41: Строка 41:
 
В коде вызывается метод объекта yaCounterХХХХХХХХ, где ХХХХХХХХ - индивидуальный номер счетчика клиента. Название объекта везде на сайте должно совпадать.
 
В коде вызывается метод объекта yaCounterХХХХХХХХ, где ХХХХХХХХ - индивидуальный номер счетчика клиента. Название объекта везде на сайте должно совпадать.
 
Создание объекта метрики выглядит примерно так:
 
Создание объекта метрики выглядит примерно так:
<source lang=javascript>
+
<source lang="javascript">
 
w.yaCounterХХХХХХХХ = new Ya.Metrika({id:ХХХХХХХХ,
 
w.yaCounterХХХХХХХХ = new Ya.Metrika({id:ХХХХХХХХ,
 
webvisor:true,
 
webvisor:true,
Строка 49: Строка 49:
 
</source>
 
</source>
 
Этот код можно поискать по странице и узнать название объекта. Названия целей для кнопок произвольные, их вы должны придумать самостоятельно. Вот пример итогового кода для добавления
 
Этот код можно поискать по странице и узнать название объекта. Названия целей для кнопок произвольные, их вы должны придумать самостоятельно. Вот пример итогового кода для добавления
<source lang=javascript>
+
<source lang="javascript">
 
<script>
 
<script>
 
     $(document).ready(function(){
 
     $(document).ready(function(){
Строка 59: Строка 59:
 
</source>
 
</source>
 
Если необходимо навесить цель на отправку вин-запроса (на странице vinquery кнопка "Отправить запрос"), то код будет немного другой, т.к. у кнопки нет id/имени формы и она отправлется ajax'ом. Код будет вида:
 
Если необходимо навесить цель на отправку вин-запроса (на странице vinquery кнопка "Отправить запрос"), то код будет немного другой, т.к. у кнопки нет id/имени формы и она отправлется ajax'ом. Код будет вида:
<source lang=javascript>
+
<source lang="javascript">
 
<script>
 
<script>
 
  $(document).ready(function(){
 
  $(document).ready(function(){
Строка 69: Строка 69:
 
</source>
 
</source>
  
= Примеры кодов =
+
=Примеры кодов=
  
== Формы ==
+
==Формы==
  
=== Форма регистрации розница ===
+
===Форма обратной связи===
  
<source lang=javascript>
+
<source lang="javascript">
$(document).on("submit", "#formRegRetail", function() {
 
  yaCounterХХХХХХХХ.reachGoal('RegRetail');
 
  });
 
</source>
 
 
 
=== Форма регистрации ОПТ ===
 
 
 
<source lang=javascript>
 
  $(document).on("submit", "#formRegWholesale", function() {
 
  yaCounterХХХХХХХХ.reachGoal('RegWholesale');
 
  });
 
</source>
 
 
 
=== Форма обратной связи ===
 
 
 
<source lang=javascript>
 
 
$(document).on("submit", "#wFeedbackForm", function() {
 
$(document).on("submit", "#wFeedbackForm", function() {
 
   yaCounterХХХХХХХХ.reachGoal('Feedback');
 
   yaCounterХХХХХХХХ.reachGoal('Feedback');
Строка 97: Строка 81:
 
</source>
 
</source>
  
=== Форма заказа обратного звонка ===
+
===Форма заказа обратного звонка===
  
<source lang=javascript>
+
<source lang="javascript">
 
$(document).on("submit", "#callOrderForm", function() {
 
$(document).on("submit", "#callOrderForm", function() {
 
  yaCounterХХХХХХХХ.reachGoal('callOrder');
 
  yaCounterХХХХХХХХ.reachGoal('callOrder');
Строка 105: Строка 89:
 
</source>
 
</source>
  
== Корзина и оформление заказа ==
+
==Корзина и оформление заказа==
  
=== Нажать на кнопку “положить в корзину” ===
+
===Нажать на кнопку “положить в корзину”===
  
<source lang=javascript>
+
<source lang="javascript">
 
   $(document).on('click', '.addToBasketLink', function(event) {
 
   $(document).on('click', '.addToBasketLink', function(event) {
 
   yaCounterХХХХХХХХ.reachGoal('addToBasket');
 
   yaCounterХХХХХХХХ.reachGoal('addToBasket');
Строка 115: Строка 99:
 
</source>
 
</source>
  
=== Нажатие на кнопку “посмотреть цены” в каталоге ===
+
===Нажатие на кнопку “посмотреть цены” в каталоге===
  
<source lang=javascript>
+
<source lang="javascript">
 
  $(document).on('click', '.priceButton a', function(event) {
 
  $(document).on('click', '.priceButton a', function(event) {
 
     createDeferredSubmitter(
 
     createDeferredSubmitter(
Строка 132: Строка 116:
 
</source>
 
</source>
  
=== Нажать на кнопку “Оформить заказ” ===
+
===Нажать на кнопку “Оформить заказ”===
  
<source lang=javascript>
+
<source lang="javascript">
 
   $(document).on('click', '.orderCheckNoReturn, .cartSendOrderButton', function(event) {
 
   $(document).on('click', '.orderCheckNoReturn, .cartSendOrderButton', function(event) {
 
   yaCounterXXXXXXXX.reachGoal('SendOrder');
 
   yaCounterXXXXXXXX.reachGoal('SendOrder');
Строка 140: Строка 124:
 
</source>
 
</source>
  
=== Отправка заказа (переход на страницу /cart?ordercomplete) ===
+
===Отправка заказа (переход на страницу /cart?ordercomplete)===
 
Данный код необходимо размещать в инфоблоке cartSendOrderBottom
 
Данный код необходимо размещать в инфоблоке cartSendOrderBottom
  
<source lang=javascript>
+
<source lang="javascript">
 
$(window).load(function() {
 
$(window).load(function() {
 
         var ordercomplete = window.location.search;
 
         var ordercomplete = window.location.search;

Версия 12:39, 21 июля 2020

Установка целей для Яндекс.Метрики


Общие положения

Первоначально ознакомьтесь с документацией на странице https://yandex.ru/support/metrika/general/goal-js-event.html#js-event
Документация для новой версии кода Метрики (с 6.12.2018) доступна на странице https://yandex.ru/support/metrika/objects/reachgoal.html

Далее берем пример нижеуказанного кода, правим его и добавляем либо в инфоблок headScripts или в тот же инфоблок, где подключается метрика, например в sitefootinfo4, footer_copyright.

<script>
$(document).ready(function(){
 $(document).on("submit", "#celector", function() {
 yaCounterХХХХХХХХ.reachGoal('НАЗВАНИЕ_СОБЫТИЯ');
 });
});
</script>

или

<script>
$(document).ready(function(){
 $(document).on("click", "#celector", function() {
 yaCounterХХХХХХХХ.reachGoal('НАЗВАНИЕ_СОБЫТИЯ');
 });
});
</script>

Указываем submit, если нужно вызвать событие при отправке формы. Например, формы регистрации (т.е. где заполняются поля). В таком случае в качестве "#celector" указываем имя/id этой формы.

Вот пример кода формы

<form method="post" action="/?page=reg&switch_to_opt" NAME="form1" id="formRegWholesale">

поэтому будет "#formRegWholesale".

Выделение 999(019).jpg

Увеличенный фрагмент исходного кода.

Выделение 999(020).jpg

Если указать click, тогда цель будет срабатывать при каждом клике на кнопку. В таком случае в качестве "#celector" указываем ".класс" или "#id" ссылки. Либо, если того и того нет, то name (в квадратных скобках [name='button'])

В коде вызывается метод объекта yaCounterХХХХХХХХ, где ХХХХХХХХ - индивидуальный номер счетчика клиента. Название объекта везде на сайте должно совпадать. Создание объекта метрики выглядит примерно так:

w.yaCounterХХХХХХХХ = new Ya.Metrika({id:ХХХХХХХХ,
webvisor:true,
clickmap:true,
trackLinks:true,
accurateTrackBounce:true,params:window.yaParams||{ }});

Этот код можно поискать по странице и узнать название объекта. Названия целей для кнопок произвольные, их вы должны придумать самостоятельно. Вот пример итогового кода для добавления

<script>
     $(document).ready(function(){
          $(document).on("submit", "#formRegWholesale", function() {
          yaCounterХХХХХХХХХ.reachGoal('REGISTER_OPT');
          });
     });
</script>

Если необходимо навесить цель на отправку вин-запроса (на странице vinquery кнопка "Отправить запрос"), то код будет немного другой, т.к. у кнопки нет id/имени формы и она отправлется ajax'ом. Код будет вида:

<script>
 $(document).ready(function(){
  $('.wVinquAdd input.submit-query').on("click", function() {
  yaCounterХХХХХХХХХ.reachGoal('НАЗВАНИЕ_СОБЫТИЯ');
  });
 });
 </script>

Примеры кодов

Формы

Форма обратной связи

$(document).on("submit", "#wFeedbackForm", function() {
  yaCounterХХХХХХХХ.reachGoal('Feedback');
 });

Форма заказа обратного звонка

$(document).on("submit", "#callOrderForm", function() {
 yaCounterХХХХХХХХ.reachGoal('callOrder');
 });

Корзина и оформление заказа

Нажать на кнопку “положить в корзину”

  $(document).on('click', '.addToBasketLink', function(event) {
   yaCounterХХХХХХХХ.reachGoal('addToBasket');
  });

Нажатие на кнопку “посмотреть цены” в каталоге

 $(document).on('click', '.priceButton a', function(event) {
    createDeferredSubmitter(
      event,
      function (link) {
        yaCounterXXXXXXXX.reachGoal('posmotret_ceny');
      },
      function (link) {
        link.click();
      },
      this
    );
  });

Нажать на кнопку “Оформить заказ”

  $(document).on('click', '.orderCheckNoReturn, .cartSendOrderButton', function(event) {
   yaCounterXXXXXXXX.reachGoal('SendOrder');
  });

Отправка заказа (переход на страницу /cart?ordercomplete)

Данный код необходимо размещать в инфоблоке cartSendOrderBottom

$(window).load(function() {
        var ordercomplete = window.location.search;
        var page = window.location.pathname;
        if (page == '/cart' && ordercomplete == '?ordercomplete') {
            yaCounterXXXXXXXX.reachGoal(ordercomplete);
        };
    });