TikTok Pixel: встановлення та налаштування

Повний гайд із встановлення TikTok Pixel на сайт — вручну та через Google Tag Manager. Налаштування подій, перевірка роботи та поради з оптимізації конверсій.

TikTok Pixel — це невеликий фрагмент JavaScript-коду, який встановлюється на ваш сайт і дозволяє відстежувати дії відвідувачів після перегляду рекламного оголошення. Завдяки Pixel TikTok розуміє, хто здійснив покупку, зареєструвався або додав товар у кошик — і на основі цих даних алгоритм знаходить схожих користувачів, щоб показувати їм вашу рекламу. Без Pixel ефективність рекламних кампаній у TikTok значно нижча: ви не зможете запускати кампанії на конверсії, будувати lookalike-аудиторії та розуміти, які оголошення реально приносять продажі.

🔍 Навіщо потрібен TikTok Pixel?

  • Відстеження конверсій — знаєте, скільки продажів принесла реклама
  • Оптимізація за конверсіями — алгоритм шукає тих, хто купить, а не просто клікне
  • Ретаргетинг — повертайте відвідувачів, які не завершили покупку
  • Lookalike-аудиторії — знаходьте нових клієнтів, схожих на ваших покупців
  • Аналітика воронки — розумійте, на якому етапі втрачаєте клієнтів
1

Створення Pixel у TikTok Ads Manager

Перш ніж встановлювати Pixel на сайт, потрібно створити його в рекламному кабінеті TikTok.

  1. Увійдіть до TikTok Ads Manager на ads.tiktok.com
  2. У верхньому меню перейдіть до Assets (Активи)Events (Події)
  3. Натисніть вкладку Web Events
  4. Клікніть кнопку «Create Pixel»
  5. Введіть назву Pixel (наприклад: «Мій інтернет-магазин»)
  6. Оберіть метод підключення: TikTok Pixel (JavaScript) або Events API (серверне відстеження). Для більшості сайтів підходить стандартний TikTok Pixel.
  7. Натисніть «Next»
  8. Оберіть спосіб встановлення: Manual Installation (вручну) або Partner Platform (через платформу — Shopify, WooCommerce тощо)

Після натискання «Create» ви отримаєте унікальний Pixel ID і базовий JavaScript-код. Збережіть Pixel ID — він знадобиться для GTM та інших інтеграцій.

2

Встановлення Pixel вручну

Якщо у вас є доступ до коду сайту напряму, встановити Pixel вручну — найшвидший спосіб.

Кроки для ручного встановлення:

  1. У TikTok Ads Manager скопіюйте базовий код Pixel (Base Code). Він виглядає як блок JavaScript з вашим унікальним Pixel ID.
  2. Відкрийте HTML-код вашого сайту (або шаблону теми, якщо використовуєте CMS).
  3. Знайдіть закриваючий тег </head> на кожній сторінці.
  4. Вставте код Pixel безпосередньо перед тегом </head>.
  5. Збережіть і опублікуйте зміни.
  6. Переконайтеся, що код розміщено на ВСІХ сторінках сайту, а не лише на головній.

Для популярних CMS:

  • WordPress: Appearance → Theme Editor → header.php, або використайте плагін «Insert Headers and Footers»
  • Shopify: Online Store → Themes → Edit Code → layout/theme.liquid, вставте перед </head>
  • Wix: Settings → Custom Code → Head section
  • Tilda: Site Settings → Analytics → Custom scripts (у блоці <HEAD>)
  • OpenCart: Admin → Extensions → Modules, або в шаблоні header.tpl

Після встановлення базового коду сайт починає фіксувати всі відвідування (подія PageView спрацьовує автоматично при кожному завантаженні сторінки).

3

Встановлення Pixel через Google Tag Manager (GTM)

Google Tag Manager — зручний спосіб керувати всіма маркетинговими тегами без змін у коді сайту. Якщо GTM вже встановлено на вашому сайті, додати TikTok Pixel займе 5 хвилин.

Кроки встановлення через GTM:

  1. Увійдіть до вашого контейнера в Google Tag Manager (tagmanager.google.com)
  2. Перейдіть до розділу Tags (Теги) → натисніть New (Новий)
  3. Клікніть на область «Tag Configuration» і оберіть «Custom HTML»
  4. Вставте скопійований базовий код TikTok Pixel у поле HTML
  5. У розділі Triggering (Тригери) натисніть «+» і оберіть тригер «All Pages» (Усі сторінки)
  6. Дайте тегу назву: «TikTok Pixel — Base Code»
  7. Натисніть Save (Зберегти)
  8. Натисніть кнопку Submit (Опублікувати) у правому верхньому куті GTM, щоб зміни набрали чинності

Перевірка перед публікацією: використайте режим Preview у GTM (кнопка «Preview» поруч з «Submit»). GTM відкриє ваш сайт у режимі налагодження і покаже, чи спрацьовує тег TikTok Pixel при завантаженні сторінки.

GTM-метод має ще одну перевагу: ви можете легко додавати нові події Pixel (AddToCart, Purchase тощо) без звернення до розробника — просто створюйте нові теги з відповідними тригерами.

Готові запустити конверсійну рекламу?

Встановіть Pixel та запустіть першу кампанію з оптимізацією за конверсіями.

Зареєструватися в TikTok Ads →
4

Налаштування подій відстеження

Базовий код Pixel фіксує лише перегляди сторінок (PageView). Щоб відстежувати дії користувачів — перегляди товарів, додавання до кошика, покупки — потрібно налаштувати стандартні події.

👁️ ViewContent

Спрацьовує при перегляді конкретної сторінки товару або послуги. Допомагає відслідковувати інтерес до конкретних продуктів.

ttq.track('ViewContent', {content_id: '123', content_type: 'product'});

🛒 AddToCart

Фіксує момент, коли користувач додає товар у кошик. Ключова подія для ретаргетингу «кинутого кошика».

ttq.track('AddToCart', {value: 299, currency: 'UAH'});

💰 Purchase

Найважливіша подія — фіксує завершену покупку. Запускайте конверсійні кампанії, оптимізовані саме за Purchase.

ttq.track('Purchase', {value: 599, currency: 'UAH'});

✅ CompleteRegistration

Реєстрація або заповнення форми. Ідеально для онлайн-курсів, SaaS, лідогенерації та вебінарів.

ttq.track('CompleteRegistration');

Як додати події вручну: скопіюйте відповідний рядок коду події і розмістіть його на потрібній сторінці або прив'яжіть до кнопки (наприклад, «Купити»). Код події розміщується після базового коду Pixel, у розділі <body>.

Як додати події через GTM:

  1. Створіть новий тег типу Custom HTML
  2. Вставте код події (наприклад, ttq.track('Purchase', {value: {{Order Value}}, currency: 'UAH'});)
  3. Оберіть тригер: для Purchase — сторінка підтвердження замовлення (URL Contains «/thank-you»)
  4. Для AddToCart — тригер Click на кнопку «Додати в кошик»
  5. Збережіть і опублікуйте

Інші корисні події TikTok Pixel:

  • InitiateCheckout — початок оформлення замовлення
  • AddPaymentInfo — введення платіжних даних
  • Search — пошук по сайту
  • SubmitForm — відправка форми
  • Subscribe — підписка на розсилку
  • Contact — звернення через форму зворотного зв'язку
5

Перевірка роботи через TikTok Pixel Helper

Після встановлення Pixel обов'язково перевірте його роботу. Найзручніший інструмент для цього — TikTok Pixel Helper, безкоштовне розширення для браузера Chrome.

Як встановити та використовувати TikTok Pixel Helper:

  1. Перейдіть до Chrome Web Store і знайдіть «TikTok Pixel Helper»
  2. Встановіть розширення — воно з'явиться у вигляді іконки в панелі браузера
  3. Відвідайте ваш сайт (наприклад, відкрийте головну сторінку)
  4. Натисніть на іконку розширення — відкриється панель з інформацією про Pixel
  5. Якщо Pixel встановлено коректно, ви побачите зелену галочку і назву вашого Pixel
  6. Перейдіть на сторінку товару — перевірте, чи спрацьовує ViewContent
  7. Додайте товар у кошик — перевірте AddToCart
  8. Здійсніть тестову покупку — перевірте Purchase

Що означають статуси в Pixel Helper:

  • ✅ Active — Pixel знайдено і коректно відпрацьовує
  • ❌ No Pixel Found — код не знайдено. Перевірте, чи правильно вставили код
  • ⚠️ Multiple Pixels — встановлено кілька Pixel на одній сторінці. Видаліть дублікати
  • ⚠️ Event not firing — базовий код є, але подія не спрацьовує. Перевірте тригери GTM або код події

Перевірка в TikTok Ads Manager: крім розширення, ви можете перевірити отримання подій у самому кабінеті. Перейдіть до Assets → Events → оберіть ваш Pixel → вкладка «Diagnostics». Тут показано, які події отримано за останні 7 днів та їх кількість. Якщо дані з'явилися — Pixel працює коректно.

Поширені проблеми та вирішення:

  • Pixel не спрацьовує після GTM: переконайтеся, що ви опублікували зміни (Submit), а не лише зберегли
  • Дані не відображаються в кабінеті: зачекайте до 24 годин — TikTok обробляє дані з затримкою
  • Дублювання подій: якщо Purchase рахується двічі — перевірте, що код розміщено лише на одній сторінці підтвердження
  • Pixel заблоковано adblocker: частина користувачів блокує Pixel. Для точнішого відстеження налаштуйте Events API (серверне відстеження)

Поради щодо роботи з TikTok Pixel

🔄

Збирайте дані до запуску реклами

Встановіть Pixel якомога раніше — навіть якщо не плануєте рекламу найближчим часом. Дані про відвідувачів накопичуються і будуть корисні для ретаргетингу.

💡

Передавайте цінність конверсій

Вказуйте параметри value і currency у події Purchase. Так TikTok зможе оптимізувати рекламу за ROAS (повернення витрат на рекламу).

🛡️

Використовуйте Events API

Серверне відстеження через Events API забезпечує точніші дані, навіть коли клієнтський Pixel заблоковано. Ідеально поєднувати обидва методи.

Накопичіть 50+ конверсій

Для ефективного навчання алгоритму потрібно мінімум 50 подій конверсії на тиждень. Якщо конверсій менше — оптимізуйтеся за початком воронки (ViewContent, AddToCart).

📊

Налаштуйте Custom Conversions

Для специфічних дій (наприклад, перегляд сторінки подяки або кліки по телефону) створюйте кастомні конверсії на основі URL або подій.

🔐

Дотримуйтеся GDPR

Не забудьте вказати у вашій Політиці конфіденційності використання TikTok Pixel та отримати згоду користувача через cookie-банер перед активацією відстеження.

Встановіть Pixel і запустіть рекламу сьогодні

TikTok Pixel — ваш найцінніший інструмент для масштабування продажів. Зареєструйтеся в TikTok Ads Manager, встановіть Pixel і отримайте перші конверсії вже цього тижня.

Почати роботу з TikTok Ads →

Реєстрація безкоштовна. Pixel встановлюється за 10 хвилин.