← Назад до блогу

Як встановити Яндекс Метрику на сайт: покрокова інструкція

Дізнайтеся, як створити лічильник Яндекс Метрики, налаштувати Вебвізор та встановити код на сайт через CMS або HTML, щоб відстежувати трафік і поведінку користувачів.

Як встановити Яндекс Метрику на сайт: покрокова інструкція

Яндекс Метрика - це безкоштовний сервіс вебаналітики від Яндекса. З його допомогою ви побачите, скільки людей заходить на сайт, звідки вони приходять, які сторінки переглядають і де «відвалюються». У цій статті розберемося, як створити лічильник, встановити його код на сайт, перевірити роботу та не наступити на типові «граблі». Інструкція підійде власникам сайтів на CMS і тим, хто редагує HTML вручну.

Редакція перевірила інтерфейс Метрики на момент публікації. Яндекс періодично змінює верстку налаштувань, тому назви пунктів можуть відрізнятися на 1-2 слова, але логіка залишається незмінною.


TL;DR

  • Зареєструйтеся або увійдіть через акаунт Яндекса на https://metrica.yandex.com/.
  • Створіть лічильник, вкажіть домен і відразу увімкніть Вебвізор.
  • Скопіюйте код лічильника та вставте його в <head> усіх сторінок.
  • Для CMS (WordPress, Tilda, Бітрікс, Wix) є готові поля або плагіни.
  • Перевірте встановлення в розділі «Налаштування → Код лічильника»: статус має змінитися на «працює».
  • Налаштуйте 3-5 базових цілей: клік по кнопці, надсилання форми, перегляд ключової сторінки.
  • Після встановлення зазирніть у звіти «Джерела», «Карти» та «Вебвізор», інакше налаштування не окупиться.

Що таке Яндекс Метрика і навіщо її ставити

Яндекс Метрика збирає знеособлені дані про відвідувачів: пристрої, регіон, джерело переходу, поведінку на сторінках. На відміну від внутрішніх лічильників CMS, вона дає два унікальні інструменти: Вебвізор (запис дій відвідувача у форматі відео) та Карти (теплові карти кліків і скролінгу).

Без аналітики ви працюєте наосліп. Запустили рекламу чи розсилку, оновили дизайн, а зрозуміти, що саме спрацювало, неможливо. Після встановлення лічильника у вас з'явиться точна картина: які канали приводять покупців, які сторінки гальмують воронку та що роблять люди перед тим, як піти.

Сервіс повністю безкоштовний, обмежень щодо трафіку для більшості сайтів немає.

Метрика чи Google Analytics: коротко

Часто запитують, що обрати. Стисло:

  • Метрика краще працює в Рунеті: точніше визначає джерела з Яндекса, має Вебвізор та Карти «з коробки», нативну інтеграцію з Яндекс Директом та інтерфейс російською.
  • Google Analytics 4 зручніша для міжнародного трафіку, гнучкіша в налаштуванні подій та атрибуції, краще пов'язана з Google Ads та BigQuery, але без VPN частина звітів у Росії працює нестабільно.

Конфлікту між ними немає, багато хто використовує обидва лічильники для перехресної перевірки. Для російськомовного сайту Метрику ставлять першою, GA4 - як доповнення.


Що знадобиться перед встановленням

Підготуйте все заздалегідь, і встановлення займе 15-20 хвилин:

  1. Акаунт Яндекса. Краще створити окрему поштову скриньку для робочих сервісів, а не використовувати особисту.
  2. Доступ до коду сайту або адмінки CMS. Для WordPress це FTP або адмінка з правами адміністратора; для Tilda, Wix, Бітрікс достатньо входу в особистий кабінет.
  3. Адреса сайту у форматі example.com без http та слешів.
  4. Політика конфіденційності та банер cookies. Згідно із законодавством про захист персональних даних, ви зобов'язані повідомити користувача про збір даних і отримати згоду. Без цього Метрика технічно працюватиме, але юридично ви ризикуєте отримати штраф. Мінімум: банер при першому візиті, сторінка «Політика конфіденційності» зі згадкою Метрики, посилання на політику у футері. Для WordPress підійдуть плагіни Cookie Notice та Complianz, у Tilda є вбудований блок T855.
  5. 5-10 хвилин на перевірку після встановлення.

Якщо у вас немає прав на редагування коду або потрібного плагіна в CMS, заздалегідь домовтеся з розробником. Найчастіше вставка коду займає п'ять хвилин, але без доступу її не зробити.


Крок 1. Створіть лічильник в інтерфейсі Метрики

Перейдіть на https://metrica.yandex.com/ і увійдіть в акаунт Яндекса. Якщо акаунта немає, натисніть «Створити акаунт» і пройдіть звичайну реєстрацію.

Після входу ви потрапите на сторінку зі списком лічильників. Якщо це ваш перший лічильник, побачите велику кнопку «Додати лічильник». Натисніть її.

Логотип та назва Metrica, жовта кнопка "Add tag" та поле введення "Find tag" зі стрілкою.

У формі створення заповніть:

  • Назва лічильника. Будь-яка зрозуміла вам. Зазвичай я вказую назву домену, наприклад «shop-example-ru».
  • Адреса сайту. Вводьте без https://, тільки example.com. Якщо сайт має кілька доменів або піддоменів, додайте їх у поле «Додаткові адреси».
  • Часовий пояс. Впливає на те, як дані розподіляються за днями у звітах. Вкажіть свій реальний пояс.
  • Прийняти умови використання. Поставте галочку.

Далі йдуть перемикачі. Увімкніть відразу:

  • Вебвізор, карта скролінгу, аналітика форм. Без цього ви втратите половину користі від Метрики.
  • Автоматичні цілі. Метрика сама почне фіксувати кліки по телефонах, email та надсилання форм. Зручно для старту.

Натисніть «Створити лічильник». Відкриється сторінка з кодом.

Вікно створення нового тегу з полями "Tag name" (IndexTop) та "Website URL" (indextop.io) і кнопкою "Next".


Крок 2. Скопіюйте код лічильника

Після створення ви побачите блок HTML-коду на кшталт <script type="text/javascript">...</script>. Усередині є числовий ID лічильника (зазвичай 8-9 цифр). Цей ID знадобиться для CMS та плагінів.

Над кодом є перемикачі:

  • Електронна комерція. Вмикайте, якщо у вас інтернет-магазин і ви плануєте відстежувати замовлення.
  • Хеш в адресі сторінки. Дозволяє враховувати зміни в URL після #. Для SPA-сайтів (React, Vue, Next.js) однієї галочки замало, потрібно додатково викликати ym(ID, 'hit', url) при кожній зміні роуту.
  • Точний показник відмов. Допомагає коректніше рахувати відмови (за часом перебування на сторінці).
  • В один рядок. Робить код компактним. Я зазвичай обираю цей варіант, щоб код було зручніше вставляти.

Натисніть «Скопіюйте код». Відкрийте текстовий редактор (Notepad++, VS Code тощо) і тимчасово збережіть код туди, щоб не загубити його при перемиканні вкладок.

ID лічильника запишіть окремо. Багато CMS та плагінів просять лише його, а не весь HTML. Повний опис параметрів є в офіційній документації Метрики.

Метод встановлення коду Яндекс.Метрики на сайт з вкладками HTML, CMS, Manage tags, SPA та кнопками Get started, Check tag, What's next?

Крок 3. Встановіть код на сайт

Спосіб залежить від того, як створено сайт. Розглянемо чотири популярні варіанти.

Варіант А. HTML-сайт (редагування коду вручну)

Відкрийте файл шаблону, де знаходиться секція <head>. Зазвичай це index.html, header.php, base.html тощо. Вставте код Метрики відразу після тегу <head> або безпосередньо перед </head>. Яндекс рекомендує ставити його якомога ближче до початку <head>, щоб Вебвізор коректно фіксував перші дії користувача.

Якщо сторінок кілька і вони верстаються окремо, код потрібен на кожній. Тому простіше використовувати загальний шаблон шапки, ніж копіювати код вручну в кожен файл.

Збережіть файл і завантажте його на сервер через FTP/SFTP. Відкрийте сайт у режимі інкогніто та переходьте до кроку 4 (перевірка).

Варіант Б. WordPress

Три робочі способи:

  1. Плагін Insert Headers and Footers або WPCode. Універсальне рішення: вставляєте повний HTML-код у поле «Scripts in Header». Це найнадійніший варіант, бо при зміні теми лічильник не зникне.
  2. Тема з полем для скриптів. Багато сучасних тем (Astra, GeneratePress, OceanWP) мають розділ Customize → Header & Footer Scripts. Вставте туди повний HTML-код Метрики.
  3. Через файл header.php дочірньої теми. Вставте код перед </head> або підключіть через хук wp_head. Підходить для досвідчених користувачів.

Раніше часто використовували спеціальні плагіни «Yandex Metrica», але більшість із них давно не оновлювалися. Універсальні плагіни для вставки скриптів надійніші.

Варіант В. Tilda

В особистому кабінеті Tilda відкрийте проект, перейдіть у «Налаштування сайту» → «Аналітика». Знайдіть поле «Яндекс Метрика. ID лічильника» і вставте тільки число (наприклад, 12345678). Повний HTML-код тут не потрібен, Tilda сама додасть усе необхідне.

Опублікуйте всі сторінки заново - це критично важливо, інакше код не з'явиться на сайті.

Варіант Г. Бітрікс, Wix, Insales, Shopify та інші

Логіка всюди однакова: в адмінці CMS є розділ «Аналітика», «Зовнішні скрипти» або поле для довільного HTML у <head>.

  • 1С-Бітрікс: найпростіше вставити код у шаблон сайту. Відкрийте «Сайт → Налаштування → Сайти → Шаблони сайтів», знайдіть свій шаблон і у файлі header.php додайте код Метрики перед </head>.
  • InSales: Сайт → Вебаналітика → Яндекс Метрика, вставте ID.
  • Wix: Marketing & SEO → Marketing Integrations → Yandex Metrica (доступно на платних тарифах). Якщо інтеграція недоступна, використовуйте Settings → Custom Code з тригером «All Pages».
  • Shopify: Online Store → Themes → Edit code → файл theme.liquid, вставте код перед </head>.

Варіант Д. Через Google Tag Manager

Якщо у вас уже встановлено GTM, додайте Метрику через тег «Custom HTML». Вставте повний код лічильника, триггер - «All Pages». Це зручно, коли на сайті багато скриптів і ви не хочете щоразу редагувати код.

Мінус: завантаження через GTM додає невелику затримку. Для більшості сайтів це непомітно, але для високонавантажених проектів краще ставити Метрику напряму.

Код JavaScript лічильника Яндекс.Метрики з ID 109602278, виділений зеленим кольором, на чорному фоні.

Крок 4. Перевірте, чи запрацював лічильник

Відразу після встановлення статус лічильника в інтерфейсі може бути «не встановлено» або «не працює». Це нормально, перевірка займає до 30 хвилин.

Способи перевірки:

  1. В інтерфейсі Метрики. Зайдіть у «Налаштування» → «Лічильник». Поруч із номером з'явиться індикатор. Зелений кружечок і напис «працює» означають, що все гаразд.
  2. Відкрийте сайт в інкогніто. Почекайте 1-2 хвилини. Зайдіть у Метрику → «Звіти» → «Відвідуваність». Має з'явитися один візит (ваш).
  3. Через Яндекс Метрика Tag Assistant (розширення для Chrome). Воно покаже ID лічильника на сторінці та наявність помилок.
  4. Через DevTools. Відкрийте сайт, F12 → Network → фільтр за словом mc.yandex. Якщо бачите запити до mc.yandex.ru/watch/..., лічильник надсилає дані.

Якщо за пів години статус не змінився, перейдіть до розділу з помилками.

Інтерфейс вкладки Network в інструментах розробника браузера, з фільтром yandex.com та запитом solid.ws

Крок 5. Налаштуйте базові цілі

Лічильник збирає дані про візити автоматично, але цілі (конверсії) потрібно налаштовувати самостійно. Ціль - це конкретна цінна дія: заявка, замовлення, дзвінок або реєстрація.

Зайдіть у «Налаштування» → «Цілі» → «Додати ціль». Метрика пропонує кілька типів:

  • Кількість переглядів. Спрацьовує, якщо відвідувач відкрив N сторінок за візит. Корисно для медіаресурсів.
  • Відвідування сторінок. URL містить / дорівнює / починається з. Найпопулярніший тип: сторінка подяки, кошик, контакти.
  • JavaScript-подія. Спрацьовує при виклику ym(ID, 'reachGoal', 'назва_цілі'). Потрібно для кнопок, форм та кліків по елементах.
  • Клік по кнопці. Метрика сама зафіксує кліки по обраних елементах без редагування коду. Працює не на всіх верстках, тому для критичних подій краще використовувати JS-цілі.

Приклад JS-цілі для кнопки «Замовити»: створіть ціль «JavaScript-подія» з ідентифікатором order_click. У коді кнопки додайте:

<button onclick="ym(12345678, 'reachGoal', 'order_click')">
  Замовити
</button>

Де 12345678 - ваш ID лічильника. Після кліку Метрика зафіксує досягнення цілі.

Для типового сайту раджу відразу налаштувати 3-5 цілей:

  1. Надіслання форми заявки.
  2. Клік по кнопці «Купити» або «Замовити».
  3. Перегляд сторінки «Контакти».
  4. Клік по номеру телефону (автоціль).
  5. Скрол до футера (для лендінгів).

Що дивитися в Метриці після встановлення

Не варто просто встановити лічильник і забути про нього. Через тиждень перевірте ці звіти:

  • «Звіти → Джерела → Джерела, зведення». Покаже, звідки приходять люди: пошук, реклама, соцмережі чи прямі заходи.
  • «Звіти → Стандартні звіти → Відвідуваність». Динаміка за днями, глибина перегляду, частка відмов. Різкі стрибки можуть свідчити про технічні проблеми або успіх рекламної кампанії.
  • «Карти → Карта кліків» та «Карта скролінгу». Побачите, куди люди клікають і до якого моменту гортають сторінку.
  • «Вебвізор». Записи реальних сесій. Дивіться 5-10 записів на тиждень, особливо короткі візити. Це найшвидший спосіб знайти помилки в інтерфейсі.

Для рекламних кабінетів відкрийте доступ Яндекс Директу в розділі «Налаштування → Доступ», щоб дані про конверсії автоматично використовувалися для оптимізації стратегій.


Часті помилки при встановленні

Лічильник встановлено не на всіх сторінках. Буває, якщо код додали лише в один шаблон. Перевірте різні сторінки через Tag Assistant.

Помилки в коді. Зайві пробіли або втрачені символи при копіюванні. Краще скопіювати код заново з інтерфейсу.

Два лічильники на одній сторінці. Наприклад, один через плагін, інший вручну. Це призведе до дублювання даних або збоїв.

Невідповідність ID. Перевірте, чи збігається номер лічильника в адмінці CMS та в інтерфейсі Метрики.

Код у <body> замість <head>. Метрика працюватиме, але Вебвізор може записувати сесію із затримкою.

Кешування. Після встановлення обов'язково очистіть кеш у CMS та CDN (наприклад, Cloudflare), інакше користувачі бачитимуть стару версію сторінок без лічильника.

Адблокери. Частина користувачів блокує трекери. Це не помилка, а особливість аналітики. Втрати можуть становити 5-15% трафіку.

SPA без ручного виклику ym('hit'). На React/Vue без обробки зміни роуту Метрика побачить лише перший захід на сайт.


Поради з практики

Окремий лічильник для кожного домену. Не змішуйте різні проекти в одному лічильнику, щоб не плутати звіти. Обмежень на кількість лічильників немає.

Використовуйте параметри візитів. Можна передавати дані про суму замовлення, тип клієнта або назву тарифу разом із цілями.

Не видаляйте старі лічильники. Навіть при переїзді на новий домен збережіть старий лічильник в архіві - історія трафіку може знадобитися для порівняння сезонів.

Щомісячна перевірка. Якщо розробники змінювали шаблон, лічильник міг «злетіти». Перевіряйте працездатність хоча б раз на місяць.

Налаштуйте сповіщення. У розділі «Налаштування → Сповіщення» увімкніть листи про аномалії трафіку, щоб миттєво дізнатися про падіння відвідуваності.


FAQ

Скільки коштує Яндекс Метрика?
Сервіс повністю безкоштовний. Платних тарифів або обмежень за обсягом даних немає.
Чи можна ставити Метрику та Google Analytics одночасно?
Так, вони не конфліктують. Це стандартна практика для перехресної перевірки даних.
Коли з'являться дані у звітах?
Перші візити видно вже за 1-2 хвилини. Повні дані за добу формуються до ранку наступного дня.
Що робити, якщо статус «не працює»?
Перевірте запити до mc.yandex.ru через DevTools. Якщо вони є - просто зачекайте 30 хвилин, статус оновиться.
Чи збережеться лічильник при зміні теми?
Якщо код вбудовано в шаблон теми, він зникне. Краще використовувати плагіни або GTM, щоб не залежати від дизайну.

Висновок

Встановлення Яндекс Метрики займає до 20 хвилин, а отримані дані допомагатимуть вам роками. Головне - переконатися, що код є на всіх сторінках, увімкнути Вебвізор та налаштувати цілі. Поверніться до звітів за тиждень після встановлення, щоб почати приймати рішення на основі реальних цифр.