March 29, 2023

Создание и настройка Facebook Pixel

Чтобы создать пиксель, необходимо зайти в Events Manager и нажать на зеленую кнопку +

В открывшемся окне Подключение нового источника данных выбираем Интернет и жмем Начать

Далее выбираем Пиксель Facebook и нажимаем Подключить


На следующей страничке прописываем название нашего счетчика, урл вашего потока или сайта и кликаем Продолжить.

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

При создании рекламной кампании выбираем цель Конверсии

При создании рекламной кампании выбираем раздел Объявления и выбираем раннее созданный Пиксель.



Добавление пикселя при скачивании лендинга на хостинг

При скачивании лендинга на хостинг скрипты пикселя нужно установить перед закрывающим тегом </head> в файлы:
- index.php - в корне ленда,
- invoice2/index.php - страница «Спасибо».

Второй вариант - в:
- trackers.php - отображается на самом лендинге,
- trackers_order.php - на странице спасибоПри скачивании лендинга на хостинг скрипты пикселя нужно установить перед закрывающим тегом </head> в файлы:
- index.php - в корне ленда,
- invoice2/index.php - страница «Спасибо».

Второй вариант - в:
- trackers.php - отображается на самом лендинге,
- trackers_order.php - на странице спасибо

На главную страницу ставится базовый код пикселя, содержащий событие

PageView:<!— Facebook Pixel Code --> <script> ! function (f, b, e, v, n, t, s) {if (f.fbq)return; n=f.fbq=function (){n.callMethod? n.callMethod.apply (n, arguments): n.queue.push (arguments)}; if (! f._fbq)f._fbq=n; n.push=n; n.loaded=! 0; n.version='2.0'; n.queue=[]; t=b.createElement (e); t.async=! 0; t.src=v; s=b.getElementsByTagName (e)[0]; s.parentNode.insertBefore (t, s)}(window, document, 'script', 'https://connect.facebook.net/en_US/fbevents.js'); fbq ('init', 'ваш номер пикселя'); fbq ('track', 'PageView'); </script> <noscript><img height="1» width="1» style="display: none» src=»https://www.facebook.com/tr?id=ваш номер пикселя&ev=PageView&noscript=1» /></noscript> <!— End Facebook Pixel Code -->



На страницу спасибо кроме PageView нужно еще добавить событие Lead для отслеживания конверсии:

<!— Facebook Pixel Code --> <script> !function(f,b,e,v,n,t,s) {if(f.fbq)return;n=f.fbq=function(){n.callMethod? n.callMethod.apply(n,arguments):n.queue.push(arguments)}; if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0'; n.queue=[];t=b.createElement(e);t.async=!0; t.src=v;s=b.getElementsByTagName(e)[0]; s.parentNode.insertBefore(t,s)}(window, document,'script', 'https://connect.facebook.net/en_US/fbevents.js'); fbq('init', 'ваш номер пикселя'); fbq('track', 'PageView'); </script> <script>fbq('track', 'Lead');</script> <noscript><img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=ваш номер пикселя&ev=PageView&noscript=1" /></noscript> <!— End Facebook Pixel Code -->



Короткий пиксель


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

Для этого добавляем его либо в файл trackers_order.php, либо перед закрывающим тегом </head> в файл invoice2/index.php

<!— Facebook Pixel Code --> <img height="1" width="1" style="display:none"src="https://www.facebook.com/tr?id=ваш номер пикселя&ev=Lead&noscript=1"/> <!— End Facebook Pixel Code -->



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


Для этого используем приложение Facebook Pixel Helper.

Переходим по своей ссылке и смотрим, корректно ли отображаются все события:


- событие PageView на главной странице сайта:

- события PageView и Lead после совершения заказа:


Всем профита!