B2BPRO.KZ | Рекламное агентство в Алматы

Пиксель Meta на сайте: установка и проверка событий

Маркетолог проверяет события пикселя Meta на сайте: ноутбук с графиком, объёмная надпись «Пиксель»

Чтобы установить пиксель Meta, базовый код размещают в разделе <head> на каждой странице сайта, а затем отдельно настраивают события, которые для бизнеса означают результат: заявку, звонок, покупку. Проверяют установку в два шага: расширением Meta Pixel Helper в Chrome и во вкладке «Тестовые события» в Events Manager.

Обычно мы видим такую картину. Владелец бизнеса уверен, что пиксель «стоит», потому что его когда-то поставил прошлый подрядчик. В Events Manager действительно идут просмотры страниц, но заявок там нет, или их втрое больше, чем в CRM. Реклама при этом оптимизируется на клики, стоимость лида растёт, и никто не может объяснить почему.

Что такое пиксель Meta и зачем он нужен рекламе

Пиксель Meta нужен, чтобы рекламная система видела не только клики по объявлению, но и то, что человек сделал на сайте после клика. Пиксель Meta — это фрагмент JavaScript-кода, который передаёт в Meta данные о действиях посетителей: открытых страницах, отправленных формах, добавлениях в корзину и оплатах.

Без этих данных реклама в Facebook и Instagram работает вслепую. Алгоритм может оптимизировать кампанию только на то, что он видит. Если он видит лишь клики, он будет искать людей, которые охотно кликают, а это далеко не всегда те, кто оставляет заявки. Когда же на сайте настроено событие заявки, кампанию можно оптимизировать на лиды, и система начинает подбирать аудиторию, похожую на тех, кто уже обратился.

Второе назначение пикселя — аудитории. По данным пикселя собирают посетителей сайта для ретаргетинга: например, тех, кто смотрел страницу услуги, но не оставил заявку. На их основе строят похожие аудитории. Третье — аналитика: в отчётах Ads Manager появляются стоимость заявки и стоимость покупки по каждой кампании, а не только цена клика.

В Казахстане это сильнее всего чувствуется в нишах с дорогой заявкой, например в медицине, недвижимости или B2B-услугах: от того, на что оптимизируется кампания, часто зависит, окупится ли реклама.

Как установить базовый код пикселя Meta

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

Порядок действий такой:

  1. В Meta Events Manager создайте пиксель для сайта (в новом интерфейсе Meta называет такие источники наборами данных) и скопируйте его базовый код или идентификатор.
  2. Выберите один способ установки: вручную в шаблон сайта, через поле для кода или ID пикселя в настройках CMS или конструктора, либо через Google Tag Manager.
  3. Вставьте код в <head> общего шаблона, а не отдельной страницы, и опубликуйте изменения.
  4. Сбросьте кеш сайта, если используется кеширующий плагин или CDN, иначе посетители ещё какое-то время будут получать страницы без пикселя.
  5. Откройте сайт и проверьте установку расширением Pixel Helper (подробно об этом ниже).

Сразу после загрузки базовый код отправляет событие PageView, то есть просмотр страницы. Это поведение по умолчанию, отдельно его настраивать не нужно. В код также входит блок <noscript> с картинкой размером 1×1 пиксель: он передаёт просмотр страницы даже у посетителей с отключённым JavaScript.

Главное правило на этом этапе: один способ установки. Самая частая ошибка, которую мы находим на аудитах, — пиксель вставлен дважды. Например, тема WordPress выводит его из своих настроек, а параллельно тот же код стоит в Google Tag Manager. В результате каждый просмотр страницы и каждая заявка считаются два раза, и отчёты теряют смысл. Если сайт переходил от одного подрядчика к другому, поищите код пикселя во всех местах: в шаблоне, в плагинах, в GTM, в полях для кода в настройках конструктора.

Какие события настроить: стандартные и пользовательские

Для сайта услуг обычно достаточно трёх событий: PageView (оно работает автоматически), Lead для отправленной заявки и Contact для клика по телефону или кнопке мессенджера. Интернет-магазину нужна цепочка ViewContent, AddToCart, InitiateCheckout и Purchase.

Стандартное событие — это действие из фиксированного списка Meta, который система понимает без дополнительной настройки. В справочнике стандартных событий Meta Pixel их 17: от AddToCart и Lead до Schedule, Subscribe и Purchase. На стандартные события можно оптимизировать кампании напрямую, поэтому начинать стоит с них.

Действие на сайте Стандартное событие Когда должно срабатывать Параметры
Отправка формы заявки Lead После успешной отправки, а не при клике на кнопку По желанию: value и currency
Клик по телефону или кнопке мессенджера Contact В момент клика Не обязательны
Запись на консультацию через онлайн-календарь Schedule После подтверждения записи Не обязательны
Регистрация на вебинар или в личном кабинете CompleteRegistration После успешной регистрации Не обязательны
Просмотр карточки товара ViewContent При загрузке карточки content_ids, content_type
Добавление в корзину AddToCart При нажатии «В корзину» contents, value, currency
Начало оформления заказа InitiateCheckout При переходе к оформлению num_items, value, currency
Оплата заказа Purchase На странице успешной оплаты value и currency обязательны

Для события Purchase Meta требует передавать сумму (value) и валюту (currency). Без них покупка засчитается, но посчитать окупаемость рекламы по отчётам не получится. Валюту указывают трёхбуквенным кодом, например KZT для тенге. Выбирайте ту валюту, в которой реально ведёте учёт выручки, иначе цифры в Ads Manager и в CRM не сойдутся.

Если нужного действия нет среди стандартных, используют пользовательское событие через функцию trackCustom. Пользовательское событие — это действие с вашим собственным названием, например «ДочиталДоЦены» или «СкачалПрайс». По документации Meta по отслеживанию конверсий название такого события — строка длиной не больше 50 символов. Там же указан лимит на пользовательские конверсии: не больше 100 на один рекламный аккаунт. До него редко доходят, но десятки пересекающихся конверсий потом трудно разобрать даже тому, кто их создавал.

Событие должно означать то, за что бизнес готов платить. Клик по кнопке мессенджера — это намерение, а не заявка: человек мог открыть чат и ничего не написать. Если оптимизировать кампанию на Contact, система приведёт много людей, которые кликают, но не пишут. Для казахстанских компаний, где большая часть обращений идёт через мессенджеры, это частая ловушка. Contact полезно собирать для аналитики и аудиторий, а оптимизировать кампании лучше на Lead, привязанный к реальной отправленной заявке.

Как повесить событие на форму, кнопку и страницу «спасибо»

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

Самый надёжный вариант для заявок — отдельная страница благодарности. После отправки формы посетитель попадает на страницу «Спасибо, мы перезвоним», и в её коде стоит вызов события:

fbq('track', 'Lead');

Для оплаты в код страницы успешного заказа подставляют сумму заказа из системы магазина:

fbq('track', 'Purchase', {value: 45000, currency: 'KZT'});

Сумма 45 000 здесь для примера, в реальном коде она берётся из заказа динамически.

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

Многие современные формы работают без перезагрузки страницы: заявка уходит в фоне, а на месте формы появляется надпись «Спасибо». Такие формы называют AJAX-формами. В этом случае страницы благодарности нет, и событие нужно вызывать в обработчике успешной отправки формы. Типичная ошибка — повесить Lead на клик по кнопке «Отправить». Тогда событие срабатывает и при пустых полях, и при ошибке валидации, и при повторном нажатии. Число лидов в Ads Manager растёт, а в CRM заявок столько же, сколько было.

С Google Tag Manager действует та же логика. Встроенный триггер отправки формы в GTM не всегда корректно ловит AJAX-формы, поэтому надёжнее, чтобы сайт сам передавал в dataLayer сигнал об успешной отправке, а тег пикселя срабатывал уже по нему. Для этого разработчику придётся немного доработать сайт.

Как проверить, что события приходят: Pixel Helper и тестовые события

Проверка идёт в два этапа: расширение Pixel Helper показывает, что пиксель сработал в браузере, а вкладка «Тестовые события» в Events Manager показывает, что Meta эти данные получила. Нужны обе проверки, потому что первая ничего не говорит о второй.

Meta Pixel Helper — это бесплатное расширение для Google Chrome от Meta. Согласно справке Meta о Pixel Helper (в последних версиях документации оно описано под названием Meta Ads Data Advisor), значок расширения показывает число событий пикселя на открытой странице, а боковая панель раскрывает их параметры. Расширение помечает типичные проблемы: дублирование кода на странице, установку вне раздела <head>, пропущенные параметры событий.

Пошаговая проверка выглядит так:

  1. Установите Pixel Helper в Chrome и откройте главную страницу сайта. Должен отобразиться ваш идентификатор пикселя и одно событие PageView.
  2. Если PageView два или расширение сообщает о дублировании, найдите второе место, где вставлен код, и уберите его.
  3. Откройте в Events Manager ваш пиксель и вкладку «Тестовые события». Укажите адрес сайта и откройте его из этой вкладки.
  4. Пройдите путь клиента: откройте страницу услуги, нажмите на телефон, отправьте тестовую заявку с настоящими контактами.
  5. Проверьте, что в тестовых событиях появились PageView, Contact и Lead, причём Lead ровно один раз.
  6. Сверьте, что тестовая заявка дошла в CRM или на почту. Если событие есть, а заявки нет, проблема уже не в пикселе, а в самой форме.
  7. Для магазина повторите путь до оплаты и убедитесь, что у Purchase заполнены value и currency.

Когда что-то идёт не так, симптомы обычно укладываются в несколько типовых сценариев:

Что видно Вероятная причина Что сделать
Pixel Helper не видит пиксель Изменения не опубликованы, страница отдаётся из кеша, в браузере включён блокировщик рекламы Сбросить кеш, проверить в окне без расширений-блокировщиков
Два PageView на одной странице Код вставлен дважды: в шаблоне и в GTM или в плагине Оставить один способ установки
Lead в Ads Manager больше, чем заявок в CRM Событие висит на клике по кнопке или повторяется при обновлении страницы «спасибо» Перенести Lead на успешную отправку формы
Lead меньше, чем заявок в CRM Часть посетителей блокирует пиксель, форма не вызывает событие в одном из сценариев Проверить все формы сайта, подключить Conversions API
Purchase приходит без суммы Не переданы value и currency Подставить сумму и валюту из данных заказа

Проверки при запуске недостаточно, потому что сайты меняются: разработчик обновил тему, маркетолог поставил новую форму на лендинг, конструктор перевёл формы на новый движок. Хорошая привычка — раз в месяц сверять число Lead в Ads Manager с числом заявок из рекламы в CRM за тот же период. Расхождение в пределах 10-20% объяснимо блокировщиками и разной логикой атрибуции. Если же цифры отличаются в разы, где-то сломано событие.

Почему одного браузерного пикселя уже мало: Conversions API и дедупликация

Браузерный пиксель теряет часть событий, поэтому к нему добавляют Conversions API — серверную передачу тех же событий в Meta. Conversions API — это канал, по которому данные о заявках и покупках отправляет не браузер посетителя, а ваш сервер или CRM напрямую в Meta.

Потери браузерного пикселя возникают из-за блокировщиков рекламы, настроек приватности в браузерах и тег-менеджеров, работу которых перехватывают такие инструменты. На это указывает и сама Meta в справке по Pixel Helper. Серверное событие от этих факторов не зависит: заявка сохранилась в CRM, значит, событие уйдёт.

Когда одно и то же событие приходит и из браузера, и с сервера, Meta должна понять, что это одна заявка, а не две. Для этого служит дедупликация. По правилам дедупликации событий пикселя и Conversions API должны совпасть два параметра: eventID в пикселе с event_id на сервере и название события в пикселе с event_name на сервере. Склейка работает в окне 48 часов с момента получения первого события с этим идентификатором. Из двух дублей Meta, как правило, оставляет то событие, которое пришло первым.

На практике это значит, что при отправке формы сайт генерирует уникальный идентификатор, передаёт его в вызов пикселя и вместе с заявкой в CRM, а CRM отправляет серверное событие с тем же идентификатором. Если идентификаторы не совпадают, каждая заявка в отчётах удвоится.

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

Небольшому бизнесу с одним лендингом и десятком заявок в неделю можно начать с аккуратно настроенного браузерного пикселя. Когда бюджет растёт, а решения по кампаниям принимаются по цене заявки, Conversions API уже окупает свою настройку, особенно если заявки и так попадают в CRM вроде Битрикс24 и оттуда их можно передавать на сервер Meta.

Сколько времени занимает настройка и кому её поручить

По нашему опыту, базовый код пикселя ставится за 15-30 минут, настройка и проверка событий на сайте услуг занимает от нескольких часов до рабочего дня, а подключение Conversions API с дедупликацией — отдельная задача на несколько дней с участием разработчика или специалиста по CRM.

На конструкторах с отдельным полем для ID пикселя базовая установка занимает минуты. На самописных сайтах и сложных WordPress-темах больше всего времени уходит на поиск всех форм и кнопок, где должно срабатывать событие, и на проверку каждой.

Кому поручать, зависит от того, кто отвечает за результат рекламы. Если пиксель ставит разработчик, а кампании ведёт другой подрядчик, между ними часто теряется главный вопрос: какое действие считать заявкой. Лучше, когда события определяет тот, кто будет по ним оптимизировать рекламу, а разработчик только реализует. Если вы хотите, чтобы этим занималась одна команда, можно заказать таргетированную рекламу у нас: мы начинаем с аудита пикселя и событий, настраиваем их и только потом запускаем кампании.

Перед запуском рекламы полезно пройти короткий чек-лист: код пикселя стоит один раз в <head>, Pixel Helper показывает одно событие PageView, Lead срабатывает только после успешной отправки формы, тестовая заявка видна в Events Manager и в CRM, у покупок передаются сумма и валюта. Если хотя бы один пункт не выполнен, кампания с первого дня учится на неверных данных.

Частые вопросы

Можно ли установить пиксель Meta без программиста?

Да, базовый код пикселя можно поставить самостоятельно, если в CMS или конструкторе сайта есть поле для кода в разделе head или отдельное поле для ID пикселя. Сложности обычно начинаются с событий: чтобы Lead срабатывал только после успешной отправки формы, иногда нужна доработка сайта разработчиком.

Сколько пикселей Meta нужно на один сайт?

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

Почему в Ads Manager заявок больше, чем в CRM?

Чаще всего событие Lead висит на клике по кнопке «Отправить», а не на успешной отправке формы, поэтому считаются и неудачные попытки. Вторая причина — повторное срабатывание при обновлении страницы благодарности. Третья — Conversions API без дедупликации, когда одна заявка приходит дважды: из браузера и с сервера.

Нужен ли Conversions API небольшому бизнесу?

Небольшому бизнесу с одним лендингом и небольшим бюджетом можно начать без Conversions API, с правильно настроенным браузерным пикселем. Серверная передача событий становится нужна, когда бюджет растёт и решения принимаются по цене заявки: она возвращает события, которые браузерный пиксель теряет из-за блокировщиков.

Как проверить, что пиксель Meta работает?

Проверить пиксель Meta можно за несколько минут двумя инструментами. Расширение Meta Pixel Helper для Chrome покажет, сработал ли пиксель и какие события отправил. Вкладка «Тестовые события» в Events Manager покажет, что Meta эти события получила. Для полной проверки отправьте тестовую заявку и сверьте её с CRM.

Прокрутить вверх