Orlovskih (обсуждение | вклад) м |
Pryadko (обсуждение | вклад) Метки: визуальный редактор правка из мобильной версии правка с мобильного устройства |
||
| Строка 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= | + | <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".
Увеличенный фрагмент исходного кода.
Если указать 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);
};
});