Налаштування пікселя Facebook та Conversions API на 1С-Бітрікс
Піксель Facebook не працює «з коробки» на Бітріксі — і справа не в складності коду, а в тому, що стандартний механізм підключення скриптів конфліктує з кешуванням та подійною моделлю. Базовий код пікселя вставляють у шапку через header.php або через налаштування сайту, але без передачі подій це просто лічильник відвідувань, не більше. Ми виконуємо комплексну інтеграцію під ключ з гарантією коректної передачі всіх подій.
Чому стандартне підключення пікселя не працює?
Пряма вставка скрипта в header.php здається простим рішенням, але породжує масу проблем. По-перше, при зміні шаблону або оновленні компонентів код губиться. По-друге, при використанні складових шаблонів (bitrix:page.polymorph) частина блоків кешується, і скрипт не виконується на закешованих сторінках. У результаті — пропущені конверсії та невірні дані. Наш досвід показує, що більше 30% проєктів первинно налаштовані саме так, і ми виправляємо ці помилки за 3-5 днів.
Де живе базовий код і чому там проблеми
Шаблон сайту в Бітріксі зберігає header.php у /bitrix/templates/<ім’я_шаблону>/. Вставка скрипта безпосередньо у файл — робочий варіант, але незручний: при зміні шаблону код губиться, а при використанні складових шаблонів (bitrix:page.polymorph) частина блоків кешується і піксель може не спрацьовувати на закешованих сторінках.
Правильніше використовувати компонент bitrix:main.include з встановленим параметром AREA_FILE_SHOW = head, або підключати скрипт через обробник події OnEpilog у файлі /bitrix/php_interface/init.php:
AddEventHandler("main", "OnEpilog", function() { $pixelId = COption::GetOptionString("main", "fb_pixel_id", ""); if ($pixelId) { echo '<script>/* FB Pixel code with id: ' . htmlspecialchars($pixelId) . ' */</script>'; } }); ID пікселя при цьому зберігається у таблиці b_option (модуль main), через COption::SetOptionString. Такий підхід гарантує, що код не загубиться при зміні шаблону і виконується на кожній сторінці.
Стандартні події та передача даних каталогу
Для e-commerce важливі три події: ViewContent, AddToCart, Purchase. Всі вони повинні передавати параметри товару — content_ids, content_type, value, currency.
ViewContent — викликається на сторінці детального перегляду товару. Компонент bitrix:catalog.element генерує сторінку, дані товару доступні в $arResult. Кастомізуєте template.php компонента і додаєте JS-виклик fbq('track', 'ViewContent', {...}) з підстановкою $arResult["ID"] і $arResult["PRICES"].
AddToCart — проблемніше. Додавання в кошик в Бітріксі йде через AJAX-запит до sale.basket.basket або безпосередньо через CSaleBasket::Add(). Подію пікселя потрібно стріляти в колбеку JS після успішної відповіді. У ядрі Бітрікса за додавання в кошик відповідає подія OnSaleBasketItemAdd — її можна використовувати для серверної передачі через Conversions API, але це окрема історія.
Purchase — спрацьовує на сторінці thank_you або в компоненті bitrix:sale.order.ajax після успішного оформлення. У $arResult["ORDER_ID"] є ID замовлення, суму берете з CSaleOrder::GetByID(). Переконайтеся, що передається точна сума з урахуванням доставки та знижок.
Чому варто підключити Conversions API?
Браузерний піксель втрачає дані через блокувальники реклами та iOS-обмеження. Facebook рекомендує дублювати події через серверний Conversions API. Запит йде з вашого сервера на graph.facebook.com/v18.0/<pixel_id>/events з токеном доступу. На Бітріксі це реалізується через CURLFile або стандартний \Bitrix\Main\Web\HttpClient. Вішаєте обробник на подію OnSaleOrderSaved і відправляєте Purchase з хешованим email (sha256) та event_id для дедуплікації з браузерною подією. В актуальних версіях модуля main доступний HttpClient — використовуйте його, а не file_get_contents, щоб не залежати від конфігурації allow_url_fopen.
| Параметр | Браузерний піксель | Conversions API |
|---|---|---|
| Блокувальники реклами | Не працює | Працює завжди |
| iOS 14.5+ | Втрата даних до 30% | Всі події передаються |
| Дедуплікація | Вимагає event_id | Вимагає event_id |
| Затримка | Миттєво | До кількох секунд |
| Складність налаштування | Низька | Середня |
Процес налаштування під ключ
- Аналітика — вивчення поточної структури сайту, виявлення типів подій.
- Проєктування — визначення місць вставки коду, вибір способу зберігання ID пікселя.
- Реалізація — додавання коду пікселя через OnEpilog, кастомізація шаблонів компонентів для e-commerce подій.
- Інтеграція Conversions API — налаштування серверної відправки на подію OnSaleOrderSaved.
- Тестування — перевірка через Facebook Pixel Helper та Events Manager.
- Деплой — викатка на бойовий сервер, моніторинг протягом 24 годин.
Що входить у роботу
- Налаштування базового коду пікселя зі зберіганням ID в опціях модуля.
- Впровадження подій ViewContent, AddToCart, Purchase з коректними параметрами товару.
- Інтеграція Conversions API з хешуванням email та event_id.
- Дедуплікація серверних та браузерних подій.
- Інструкція по самостійній перевірці та тестова документація.
- Гарантія працездатності протягом 30 днів після здачі.
Перевірка працездатності
Після налаштування перевіряйте через Facebook Pixel Helper (розширення Chrome) та через Events Manager у кабінеті Facebook — вкладка «Тестування подій». У тестовому режимі Conversions API видно реальний розбір payload з помилками валідації. Типова проблема: подія дублюється двічі — браузерна та серверна приходять без event_id. Без дедуплікації Facebook вважає їх двома різними конверсіями. event_id повинен бути однаковим у JS-виклику fbq('track', 'Purchase', data, {eventID: 'order_123'}) та в серверному запиті. Наш досвід показує, що грамотна дедуплікація підвищує точність відстеження до 95%.
Наші компетенції
Більше 8 років досвіду інтеграції Бітрікс з зовнішніми сервісами. Понад 50 проєктів з налаштування пікселя та API для e-commerce. Використовуємо сертифіковані підходи та офіційні рекомендації Facebook. Зв’яжіться з нами для розрахунку точної вартості — оцінимо ваш проєкт за один робочий день.