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

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

Строка 16: Строка 16:
 
</source>
 
</source>
 
или
 
или
<code>
+
<source lang=javascript line=GESHI_FANCY_LINE_NUMBERS>
<pre>
 
 
<script>
 
<script>
 
$(document).ready(function(){
 
$(document).ready(function(){
Строка 25: Строка 24:
 
});
 
});
 
</script>
 
</script>
</pre>
+
</source>
</code>
 
 
Указываем submit, если нужно вызвать событие при отправке формы. Например, формы регистрации (т.е. где заполняются поля). В таком случае в качестве "#celector" указываем имя/id этой формы.  
 
Указываем submit, если нужно вызвать событие при отправке формы. Например, формы регистрации (т.е. где заполняются поля). В таком случае в качестве "#celector" указываем имя/id этой формы.  
 
Вот пример кода формы <form method="post" action="/?page=reg&switch_to_opt" NAME="form1" id="formRegWholesale">, поэтому будет "#formRegWholesale".<br>
 
Вот пример кода формы <form method="post" action="/?page=reg&switch_to_opt" NAME="form1" id="formRegWholesale">, поэтому будет "#formRegWholesale".<br>
Строка 37: Строка 35:
 
В коде вызывается метод объекта yaCounterХХХХХХХХ, где ХХХХХХХХ - индивидуальный номер счетчика клиента. Название объекта везде на сайте должно совпадать.
 
В коде вызывается метод объекта yaCounterХХХХХХХХ, где ХХХХХХХХ - индивидуальный номер счетчика клиента. Название объекта везде на сайте должно совпадать.
 
Создание объекта метрики выглядит примерно так:
 
Создание объекта метрики выглядит примерно так:
 
+
<source lang=javascript line=GESHI_FANCY_LINE_NUMBERS>
<code>
 
<pre>
 
 
w.yaCounterХХХХХХХХ = new Ya.Metrika({id:ХХХХХХХХ,
 
w.yaCounterХХХХХХХХ = new Ya.Metrika({id:ХХХХХХХХ,
 
webvisor:true,
 
webvisor:true,
Строка 45: Строка 41:
 
trackLinks:true,
 
trackLinks:true,
 
accurateTrackBounce:true,params:window.yaParams||{ }});
 
accurateTrackBounce:true,params:window.yaParams||{ }});
</pre>
+
</source>
</code>
 
 
Этот код можно поискать по странице и узнать название объекта. Названия целей для кнопок произвольные, их вы должны придумать самостоятельно. Вот пример итогового кода для добавления
 
Этот код можно поискать по странице и узнать название объекта. Названия целей для кнопок произвольные, их вы должны придумать самостоятельно. Вот пример итогового кода для добавления
<code>
+
<source lang=javascript line=GESHI_FANCY_LINE_NUMBERS>
<pre>
 
 
<script>
 
<script>
 
     $(document).ready(function(){
 
     $(document).ready(function(){
Строка 57: Строка 51:
 
     });
 
     });
 
</script>
 
</script>
</pre>
+
</source>
</code>
 
 
Если необходимо навесить цель на отправку вин-запроса (на странице vinquery кнопка "Отправить запрос"), то код будет немного другой, т.к. у кнопки нет id/имени формы и она отправлется ajax'ом. Код будет вида:
 
Если необходимо навесить цель на отправку вин-запроса (на странице vinquery кнопка "Отправить запрос"), то код будет немного другой, т.к. у кнопки нет id/имени формы и она отправлется ajax'ом. Код будет вида:
<code>
+
<source lang=javascript line=GESHI_FANCY_LINE_NUMBERS>
<pre>
 
 
<script>
 
<script>
 
  $(document).ready(function(){
 
  $(document).ready(function(){
Строка 69: Строка 61:
 
  });
 
  });
 
  </script>
 
  </script>
</pre>
+
</source>
</code>
 
  
 
= Примеры кодов =
 
= Примеры кодов =
Строка 78: Строка 69:
 
=== Форма регистрации розница ===
 
=== Форма регистрации розница ===
  
<code>
+
<source lang=javascript line=GESHI_FANCY_LINE_NUMBERS>
<pre>
 
 
$(document).on("submit", "#formRegRetail", function() {
 
$(document).on("submit", "#formRegRetail", function() {
 
   yaCounterХХХХХХХХ.reachGoal('RegRetail');
 
   yaCounterХХХХХХХХ.reachGoal('RegRetail');
 
   });
 
   });
</pre>
+
</source>
</code>
 
  
 
=== Форма регистрации ОПТ ===
 
=== Форма регистрации ОПТ ===
  
<code>
+
<source lang=javascript line=GESHI_FANCY_LINE_NUMBERS>
<pre>
 
 
   $(document).on("submit", "#formRegWholesale", function() {
 
   $(document).on("submit", "#formRegWholesale", function() {
 
   yaCounterХХХХХХХХ.reachGoal(RegWholesale);
 
   yaCounterХХХХХХХХ.reachGoal(RegWholesale);
 
   });
 
   });
</pre>
+
</source>
</code>
 
  
 
=== Форма обратной связи ===
 
=== Форма обратной связи ===
  
<code>
+
<source lang=javascript line=GESHI_FANCY_LINE_NUMBERS>
<pre>
 
 
$(document).on("submit", "#wFeedbackForm", function() {
 
$(document).on("submit", "#wFeedbackForm", function() {
 
   yaCounterХХХХХХХХ.reachGoal('Feedback');
 
   yaCounterХХХХХХХХ.reachGoal('Feedback');
 
  });
 
  });
</pre>
+
</source>
</code>
 
  
 
=== Форма заказа обратного звонка ===
 
=== Форма заказа обратного звонка ===
  
<code>
+
<source lang=javascript line=GESHI_FANCY_LINE_NUMBERS>
<pre>
 
 
$(document).on("submit", "#callOrderForm", function() {
 
$(document).on("submit", "#callOrderForm", function() {
 
  yaCounterХХХХХХХХ.reachGoal(callOrder);
 
  yaCounterХХХХХХХХ.reachGoal(callOrder);
 
  });
 
  });
</pre>
+
</source>
</code>
 
  
 
== Корзина и оформление заказа ==
 
== Корзина и оформление заказа ==
Строка 120: Строка 103:
 
=== Нажать на кнопку “положить в корзину” ===
 
=== Нажать на кнопку “положить в корзину” ===
  
<code>
+
<source lang=javascript line=GESHI_FANCY_LINE_NUMBERS>
<pre>
 
 
   $(document).on('click', '.addToBasketLink', function(event) {
 
   $(document).on('click', '.addToBasketLink', function(event) {
 
   yaCounterХХХХХХХХ.reachGoal(addToBasket);
 
   yaCounterХХХХХХХХ.reachGoal(addToBasket);
 
   });
 
   });
</pre>
+
</source>
</code>
 
  
 
=== Нажатие на кнопку “посмотреть цены” в каталоге ===
 
=== Нажатие на кнопку “посмотреть цены” в каталоге ===
  
<code>
+
<source lang=javascript line=GESHI_FANCY_LINE_NUMBERS>
<pre>
 
 
  $(document).one('click', '.priceButton a', function(event) {
 
  $(document).one('click', '.priceButton a', function(event) {
 
     createDeferredSubmitter(
 
     createDeferredSubmitter(
Строка 144: Строка 124:
 
     );
 
     );
 
   });
 
   });
</pre>
+
</source>
</code>
 
  
 
=== Нажать на кнопку “Оформить заказ” ===
 
=== Нажать на кнопку “Оформить заказ” ===
  
<code>
+
<source lang=javascript line=GESHI_FANCY_LINE_NUMBERS>
<pre>
 
 
   $(document).on('click', '.orderCheckNoReturn, .cartSendOrderButton', function(event) {
 
   $(document).on('click', '.orderCheckNoReturn, .cartSendOrderButton', function(event) {
 
   yaCounterXXXXXXXX.reachGoal(SendOrder);
 
   yaCounterXXXXXXXX.reachGoal(SendOrder);
 
   });
 
   });
</pre>
+
</source>
</code>
 
  
 
=== Отправка заказа (переход на страницу /cart?ordercomplete) ===
 
=== Отправка заказа (переход на страницу /cart?ordercomplete) ===
 
Данный код необходимо размещать в инфоблоке cartSendOrderBottom
 
Данный код необходимо размещать в инфоблоке cartSendOrderBottom
  
<code>
+
<source lang=javascript line=GESHI_FANCY_LINE_NUMBERS>
<pre>
 
 
$(window).load(function() {
 
$(window).load(function() {
 
         var ordercomplete = window.location.search;
 
         var ordercomplete = window.location.search;
Строка 169: Строка 145:
 
         };
 
         };
 
     });
 
     });
</pre>
+
</source>
</code>
 

Версия 10:57, 18 сентября 2018

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


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

Первоначально ознакомьтесь с документацией на странице https://yandex.ru/support/metrika/general/goal-js-event.html#js-event

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

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

или

1 <script>
2 $(document).ready(function(){
3  $(document).on("click", "#celector", function() {
4  yaCounterХХХХХХХХ.reachGoal('НАЗВАНИЕ_СОБЫТИЯ');
5  });
6 });
7 </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ХХХХХХХХ, где ХХХХХХХХ - индивидуальный номер счетчика клиента. Название объекта везде на сайте должно совпадать. Создание объекта метрики выглядит примерно так:

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

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

1 <script>
2      $(document).ready(function(){
3           $(document).on("submit", "#formRegWholesale", function() {
4           yaCounterХХХХХХХХХ.reachGoal('REGISTER_OPT');
5           });
6      });
7 </script>

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

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

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

Формы

Форма регистрации розница

1 $(document).on("submit", "#formRegRetail", function() {
2    yaCounterХХХХХХХХ.reachGoal('RegRetail');
3   });

Форма регистрации ОПТ

1   $(document).on("submit", "#formRegWholesale", function() {
2    yaCounterХХХХХХХХ.reachGoal(RegWholesale);
3   });

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

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

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

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

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

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

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

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

 1  $(document).one('click', '.priceButton a', function(event) {
 2     createDeferredSubmitter(
 3       event,
 4       function (link) {
 5         yaCounterXXXXXXXX.reachGoal('posmotret_ceny');
 6       },
 7       function (link) {
 8         link.click();
 9       },
10       this
11     );
12   });

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

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

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

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

1 $(window).load(function() {
2         var ordercomplete = window.location.search;
3         var page = window.location.pathname;
4         if (page == '/cart' && ordercomplete == '?ordercomplete') {
5             yaCounterXXXXXXXX.reachGoal(ordercomplete);
6         };
7     });