Как поставить пиксель на геткурс

Обновлено: 05.07.2024

Пиксель Facebook –инструмент, без которого невозможно обойтись, если вы хотите эффективно привлекать на свой сайт потенциальных клиентов из Facebook или Instagram. В этой статье мы разберем основные вопросы, касающиеся пикселя, и рассмотрим несколько способов его установки.

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

Пиксель Facebook представляет собой небольшой фрагмент кода JavaScript, который после установки на сайт предоставляет три основные возможности:

  • Анализ поведения посетителей
    Вы можете настроить в пикселе отслеживание определенных действий (событий) на сайте, чтобы лучше понимать, как ведут себя посетители, и в дальнейшем использовать эту информацию для оптимизации маркетинга.
  • Автоматическая оптимизация рекламных кампаний
    На основании полученных пикселем данных «умный» алгоритм Facebook будет показывать вашу рекламу тем, кто с наибольшей вероятностью совершит нужное вам действие (конверсию).
  • Создание пользовательских аудиторий
    На основе событий пикселя можно создавать специально настроенные аудитории посетителей для ретаргетинга, а также находить других пользователей Facebook, похожих на ваших клиентов.

Установить пиксель Facebook на сайт можно разными способами, выбор конкретного из них может зависеть от нескольких факторов: платформа сайта, его размер и т.п. Давайте рассмотрим несколько популярных способов, а также их плюсы и минусы.

Установка пикселя Facebook непосредственно в код страниц сайта

Для начала нам необходимо получить сам код пикселя. Для этого в верхней панели меню рекламного кабинета Facebook выбираем раздел Пиксели.

Если в вашем рекламном аккаунте еще нет пикселя, у вас откроется окно, в котором нужно нажать кнопку Создать пиксель (Facebook постоянно вносит обновления, поэтому внешний вид окна может отличаться, но суть остается неизменной).

После этого в открывшемся окошке необходимо дать пикселю название и нажать кнопку Продолжить.

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

В открывшемся окне мы увидим поле с базовым кодом пикселя Facebook. Копируем его, вставляем в файл .txt и сохраняем.

После этого мы устанавливаем сохраненный код на все страницы сайта, которые хотим отслеживать. Согласно рекомендации Facebook, код пикселя должен располагаться в разделе заголовка, перед закрывающим тегом </head> .Это обеспечивает высокую точность статистики, потому что коды, установленные в разделе заголовка, загружаются первыми.

Способ установки пикселя Facebook непосредственно в код сайта обеспечивает высокую точность статистики и является довольно распространенным, но у него есть потенциальный минус – обилие различных скриптов (счетчиков Яндекс Метрики, Google Analytics и т.д., в том числе пикселя Facebook и его событий) в коде страниц может влиять на скорость их загрузки.

Установка пикселя Facebook при помощи Google Tag Manager

Сначала мы получаем базовый код пикселя в рекламном кабинете, как это описано в предыдущем способе (копируем код пикселя и сохраняем его в .txt файле), после чего переходим в установленный на сайте контейнер Google Tag Manager (GTM) и нажимаем на кнопку Добавить новый тег.

Затем кликаем на поле Конфигурация тега и в отрывшемся окне выбираем тип тега Пользовательский HTML.

В соответствующее поле вставляем базовый код пикселя Facebook из нашего .txt файла.

После этого нам нужно установить триггер активации тега. Прокручиваем страницу ниже, кликаем на поле Триггеры и в открывшемся окне выбираем All pages (Все страницы).

Даем название нашему тегу (например, FB pixel) и нажимаем кнопку Сохранить.

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

  • не требует специальных навыков или участия программиста,
  • позволяет устанавливать большое количество различных тегов (кодов) на сайт без значительного влияния на скорость загрузки страниц.

Установка пикселя Facebook при помощи партнерских интеграций

Интерфейс установки пикселя Facebook позволяет добавить его на сайт посредством интеграции с популярными платформами – WordPress, Joomla, Wix и многих других. Для этого на шаге выбора способа установки нужно нажать Добавление кода с помощью партнерских интеграций.

На следующем шаге мы видим список доступных партнеров.

Выбрав в списке подходящую платформу, можно довольно быстро добавить пиксель на сайт, следуя простым и понятным пошаговым инструкциям Facebook.

При использовании этого способа установки нужно учитывать один нюанс. На одном из шагов Facebook предлагает настроить события пикселя при помощи специального инструмента, что не всегда является подходящим вариантом. Поэтому можно пропустить этот шаг и просто установить пиксель на сайт, а к настройке событий вернуться позднее (подробно настройку событий пикселя мы рассмотрим в одной из следующих статей).

Проверка правильности установки пикселя Facebook

После того, как мы добавили пиксель на сайт тем или иным способом, необходимо удостовериться, что установка прошла корректно и он работает должным образом. Сделать это можно двумя способами: отправкой тестового трафика из интерфейса Facebook и при помощи специального инструмента Pixel Helper (рекомендую использовать их оба).

Как проверить работу пикселя с помощью отправки тестового трафика

Затем выбираем Добавление кода пикселя на сайт вручную.

После этого возвращаемся обратно на вкладку Обзор на странице пикселя. Если на ней начнут отображаться просмотры страниц (это может занять какое-то время), значит, данные поступают, и пиксель установлен правильно.

Как проверить работу пикселя с помощью Pixel Helper

На приведенной ниже картинке видно, что Pixel Helper нашел на нашем сайте один пиксель, который успешно зарегистрировал событие PageView (Просмотр страницы).

Если у вас отображается эта информация, поздравляю! Пиксель правильно установлен и работает.

Итак, мы рассмотрели несколько способов установки пикселя Facebook на сайт, а также проверку его работоспособности. На следующем этапе для эффективной работы нужно будет настроить отслеживание событий пикселя, об этом мы в самое ближайшее время подробно расскажем в отдельной статье.

Подпишись и следи за выходом новых статей в нашем монстрограмме

Остались вопросы?

Не нашли ответ на интересующий Вас вопрос? Или не нашли интересующую Вас статью? Задавайте вопросы и темы статей которые Вас интересуют в комментариях.

Внимание. ЮТМ Метки не записываются в виджете, если это всплывающий блок.

Как анализировать эффективность трафика в Геткурсе?
Самый простой способ - использовать дополнительные поля пользователей или заказов.

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

Для этого сначала добавляем дополнительные поля пользователям. И заодно в заказы.


Добавляем элемент «Строка» и называем поле utm_source. Добавляем новое поле «строка» и называем поле utm_medium. Таким же образом добавляем utm_campaign, utm_content, utm_term.


Настройка формы на сайте

После этого добавляем данные поля в обработчик формы. Выбираем поле пользователя. Из списка выбираем добавленные ранее дополнительные поля. В итоге в обработчике формы получится такая картина:


После добавления данных полей ваша форма заказа буде выглядеть так:


Позже нам нужно будет скрыть эти поля. Но мы сделаем это позже после теста.

Итак. Теперь наша форма содержит нужные нам поля и они добавлены в обработчик формы.

После этого нам нужно установить javascript. Добавляем блок JS


Код JavaScript

Теперь нам нужно найти код элемента на странице. Для этого открываем консоль браузера. Например нажать F12 или нажать правой кнопкой на странице и выбрать "Просмотреть код элемента". После этого вы увидите такое изображение:


Выбираем левый элемент обозначенный стрелкой, наводим мышку на наше дополнительное поле и получаем код элемента. В моем случае элемент называется "field-input-539755". Запоминаем данные цифры и вводим их в Js в поле "ВАШ ПАРАМЕТР". У нас должна получиться строка:

var utm_source_selector = 'input[name="formParams[userCustomFields][539755]"]'; // CSS-cелектор поля "utm_source"

Настраиваем таким же образом другие поля. Смотрим код элемента и вставляем данные в ваш Js код.

Например наша ссылка будет выглядеть так:

Переходим на ваш сайт и вы увидите в дополнительных полях ваши параметры:

Для выдачи права настраивать аккаунт администратору, ознакомьтесь с этой статьей.

Вы можете установить счётчики для отслеживания статистики и анализа посещаемости на ваш сайт, созданный в конструкторе GetCourse.

Счётчик можно добавить как на весь сайт, так и на конкретную страницу. Вы также можете установить скрипт, учитывающий достижение цели или событие.

Содержание статьи:

1. Как установить счётчик/пиксель на весь сайт?

Счётчики Яндекс.Метрики и Google Analytics, а также пиксель Facebook и ВКонтакте можно добавить в разделе «Профиль» — «Настройки аккаунта» — «Настройки» — «Счётчики и прочие скрипты», который находится по адресу:

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

В будущем планируется возможность подключения нескольких VK-сообществ к Геткурсу, поэтому счетчики задаются именно в сообществе — для каждого свои (но могут быть и одинаковые).


Счетчики (метрики) для ВК-страниц


Код, добавленный в этом разделе, будет помещен в конец кода всей страницы.

Некоторые скрипты/счётчики требуют установки в начало страницы. Для этого можно использовать страницу-header и вставить скрипт в неё.

2. Как установить счётчик на отдельную страницу?

Код счётчика/скрипта можно установить не только на весь сайт, но и на отдельную страницу.


Затем перейдите в расширенные настройки страницы и нажмите «Показать дополнительные настройки». Вставьте нужный код в поле «Теги в разделе HEAD»:

б) Чтобы установить код счётчика/скрипта на системную страницу (например, на страницу оплаты, или страницу после оплаты), откройте её в режиме редактирования. Вставьте код в поле «Теги для блока HEAD»:

3. Как установить счётчик/пиксель в разных системах аналитики?

Как установить счётчик Яндекс.Метрики

Яндекс.Метрика — это инструмент веб-аналитики, предназначенный для оценки посещаемости веб-сайтов, анализа поведения пользователей и получения детальной информации о целевой аудитории.

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

О том, как установить на сайт, сделанный в Getcourse, счетчик Яндекс.Метрики и настроить цели, вы можете узнать в данной статье. О том, как добавить счетчик и цель на отдельную страницу или в виджет, читайте тут.

КАК УСТАНОВИТЬ СЧЁТЧИК Google Analytics

Google Analytics позволяет собрать необходимые данные о посетителях сайта и поможет оптимизировать рекламные кампании Google AdWords при помощи анализа данных.

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

О том, как установить на сайт, сделанный в Getcourse, Google Analytics и настроить события, вы можете узнать в данной статье.

Как установить пиксель Facebook

Facebook Pixel — инструмент аналитики для измерения результативности рекламы. Используется, чтобы собирать, оценивать и оптимизировать работу с целевой аудиторией для проведения рекламных кампаний в Facebook.

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

О том, как установить на сайт, сделанный в Getcourse, пиксель Facebook и настроить события, вы можете узнать в данной статье.

Как установить пиксель Вконтакте

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

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

О том, как установить на сайт, сделанный в Getcourse, пиксель ВКонтакте и настроить с его помощью аудитории для ретаргетинга, вы можете узнать в данной статье.


,"level_show_send_button_always":,"editable_comments":false,"show_online_user_count":true,"collapsible":false,"object_attributes":[],"level_form_submit_on_enter":,"own_user_id":null,"invert_own_user":false,"enable_subscribe":false,"disable_links":false,"window_style":null>>>

Участник тренинга

Ксения Попова удалить Здравствуйте, мне нужно отслеживать количество пользователей, которые нажали кнопку оплатить и количество пользователей реально оплатившись. У меня пиксель от facebook. Как его использовать для этих целей? Заранее благодарю ,"level_show_send_button_always":,"editable_comments":false,"show_online_user_count":true,"collapsible":true,"object_attributes":[],"level_form_submit_on_enter":,"own_user_id":null,"invert_own_user":false,"enable_subscribe":false,"disable_links":false,"window_style":null>>>

,"level_show_send_button_always":,"editable_comments":false,"show_online_user_count":true,"collapsible":false,"object_attributes":[],"level_form_submit_on_enter":,"own_user_id":null,"invert_own_user":false,"enable_subscribe":false,"disable_links":false,"window_style":null>>>

Можно вставить код GTM? Через него счётчики будут работать? ,"level_show_send_button_always":,"editable_comments":false,"show_online_user_count":true,"collapsible":true,"object_attributes":[],"level_form_submit_on_enter":,"own_user_id":null,"invert_own_user":false,"enable_subscribe":false,"disable_links":false,"window_style":null>>>

,"level_show_send_button_always":,"editable_comments":false,"show_online_user_count":true,"collapsible":false,"object_attributes":[],"level_form_submit_on_enter":,"own_user_id":null,"invert_own_user":false,"enable_subscribe":false,"disable_links":false,"window_style":null>>>

Добрый день, подскажите, пожалуйста, как вставить на страницу сайта пиксель с Май Таргет? ,"level_show_send_button_always":,"editable_comments":false,"show_online_user_count":true,"collapsible":false,"object_attributes":[],"level_form_submit_on_enter":,"own_user_id":null,"invert_own_user":false,"enable_subscribe":false,"disable_links":false,"window_style":null>>>Если вставлять код Google Analytics в - Настройки Аккаунта -> Настройки -> Счетчики и прочие скрипты - то скрипт вставляется не в HEAD/

А его нужно в HEAD - или я не верно понял.

,"level_show_send_button_always":,"editable_comments":false,"show_online_user_count":true,"collapsible":true,"object_attributes":[],"level_form_submit_on_enter":,"own_user_id":null,"invert_own_user":false,"enable_subscribe":false,"disable_links":false,"window_style":null>>>

,"level_show_send_button_always":,"editable_comments":false,"show_online_user_count":true,"collapsible":true,"object_attributes":[],"level_form_submit_on_enter":,"own_user_id":null,"invert_own_user":false,"enable_subscribe":false,"disable_links":false,"window_style":null>>>

Верно, и в ГК нельзя установить в <HEAD> сразу для всех страниц. ,"level_show_send_button_always":,"editable_comments":false,"show_online_user_count":true,"collapsible":false,"object_attributes":[],"level_form_submit_on_enter":,"own_user_id":null,"invert_own_user":false,"enable_subscribe":false,"disable_links":false,"window_style":null>>>Пиксель ретаргетинга - инструмент, позволяющий собирать базы аудитории из посетителей Вашего сайта, чтобы в дальнейшем настраивать для этих баз показ рекламы.

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

Как разместить код пикселя Facebook

1) Перейдите к разделу "Пиксели Facebook" в "Ads Manager" - он находится по ссылке.

2) В открывшемся разделе нажмите "Создать пиксель".

phpmXUuuu

3) Введите название Вашего пикселя и нажмите "Создать".

phpFrtaAi

4) Откроется окно установки кода пикселя, выберите в нем пункт "Установить код вручную".

php7soiP9

5) Скопируйте предложенный код.

phpSlmzLI

6) Перейдите к разделу "Настройки" - "Шаблоны и файлы" (для этого Вам потребуются расширенные права доступа).

Обратите внимание!

  • Если у вас в настройках сайта есть "Блок с тегом head", вы можете разместить код более простым способом. Для этого воспользуйтесь инструкцией по ссылке.

phpDemEPw

7) В открывшемся списке шаблонов выберите шаблон "Главная.Верх".

phpGpsfpX

8) Обрамите свой код в теги . и вставьте код над тегом </head>.

Иными словами, у Вас должно получиться следующее:

phpGRd83K

9) Сохраните изменения.

phpj2Nd9h

10) Нажмите "Продолжить".

phpGN9Ohy

11) Вы попадете в раздел настроек событий. Подробнее о дальнейшей настройке читайте в инструкции Facebook.

Как разместить код пикселя Вконтакте

1) В рекламном кабинете ВКонтакте перейдите в раздел "Ретаргетинг" и нажмите "Создать единый пиксель".

phpI3u6mN

2) Откроется окно создания пикселя, где Вам будет необходимо указать:

  • Название пикселя,
  • Домен Вашего сайта,
  • Тематику сайта.

В конце нажмите "Создать".

phpmtRCMr

3) Откроется окно с кодом пикселя. Скопируйте код.

phpsnbjKk

4) Перейдите к разделу "Настройки" - "Шаблоны и файлы" (для этого Вам потребуются расширенные права доступа).

Обратите внимание!

  • Если у вас в настройках сайта есть "Блок с тегом head", вы можете разместить код более простым способом. Для этого воспользуйтесь инструкцией по ссылке.

phpDemEPw

5) В открывшемся списке шаблонов выберите шаблон "Главная.Верх".

phpGpsfpX

6) Обрамите свой код в теги . и вставьте код над тегом </head>.

Иными словами, у Вас должно получиться следующее:

phpksgaWG

7) Сохраните изменения.

phpj2Nd9h

8) Более подробную информацию по настройке пикселя ретаргетинга Вы можете получить по ссылкам:

Установка пикселя Facebook позволяет собирать аудиторию посетителей сайт и фиксировать их действия на сайте для запуска ремаркетинговых кампаний в социальной сети.

Получения кода пикселя Facebook

Для того, чтобы получить код пикселя Facebook и собрать целевую аудиторию сайта потребуется посетить рекламный кабинет (Ads Manager) и кликнуть на «Меню» (слева-сверху), после чего выбрать «Пиксели» (вкладка Events Manager).

Вкладка

На появившейся странице будут указаны все ранее добавленные счетчики, а для создания нового понадобиться кликнуть на «Добавить новый источник».

Добавление нового источника данных в Facebook Ads Manager

В выпавшем меню выбираем «Пиксель Facebook».

Создание нового пикселя Фейсбука

  • Название пикселя;
  • URL сайта (не обязательно).

Создание нового пикселя Facebook и Instagram

Далее система предложит предпочтительный вариант установки, где нужно выбрать «Настроить вручную».

Способы установки пикселя FB

Теперь нужный нам код получен и потребуется сохранить его.

Код пикселя Фейсбука и Инстаграмма

Ручная установка пикселя Facebook (Способ №1)

Ручная установка подойдет для тех, кто разбирается в структуре файлов своего сайта и обладает базовыми знаниями HTML.

Для установки потребуется внедрить код на все страницы сайта, как можно ближе к началу документа. Как правило, это элементы header (шапка сайта) или footer (подвал).

Для установки на WordPress потребуется зайти в «Внешний вид»-«Редактор» и найти файл head или footer и перед закрывающимся тегом </head> установить счетчик.

Также это можно сделать через FTP или файловый менеджер хостинга. Путь для данных файлов выглядит как «/wp-content/themes/ваша-тема/header.php».

Редактор тем и header.php в WordPress

Для установки на Opencart необходимо зайти в файловый менеджер на хостинге или через FTP и изменить файл header.tpl, стандартный путь для файла «/catalog/view/theme/ваша-тема/template/common/header.tpl».

Установка пикселя Фейсбука через Google Tag Manager (Способ №2)

Если на сайте установлен менеджер тегов Google (GTM), то процесс установки будет значительно проще.

Заходим в аккаунт GTM для нужного сайта и выбираем вкладку «Теги» и нажимаем на кнопку «Создать»

Отправка на публикацию новой версии в Google Tag Manager

Даем тегу название, например, «fb pixel» и выбираем конфигурацию тега.

Выбор типа тега в GTM

Выбираем конфигурацию тега «Пользовательский HTML»

Выбор типа тега

В появившемся редакторе вводим созданный код счетчика.

Заполненный тег пикселя Facebook в Google Менеджер Тегов

Теперь выбираем триггер для взаимодействия, который должен быть «All pages», что позволит подгружать счетчик на всех страницах сайта (где установлен Google Tag Manager).

После сохраняем тег.

Заполненный тег пикселя Facebook в Google Менеджер Тегов

Завершающий этап публикация новой версии, где также стоит указать, что основным отличием ее от предыдущей является появление тега fb-pixel.

Заполняем название и описание. Например, если Вы также публикуете и тег пикселя ВКонтакте, то можно описать как «fb+vk».

Все готово, счетчик установлен.

Установка Facebook Pixel через плагины и модули для CMS (Способ №3)

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

Для примера устанавливаем сервис Official Facebook Pixel на сайт WordPress. В первую очередь заходит в административную панель сайта и выбираем вкладку «Плагины»->«Добавить новый», а в строке поиска вводим «facebook pixel» и устанавливаем плагин.

Установка плагина для пикселя Facebook на WordPress

Активация плагина для установки пикселя Facebook на WordPress

В настройках вводим ID выданного в первой части пикселя.

Ввод ID пикселя Фейсбука в плагине для WordPress

Проверка сбора данных Facebook Pixel

Переходим в раздел пиксели, где будет указано количество действий (Page View).

Список работающих пикселей Facebook

Далее переходим в сам пиксель.

Просмотр данных пикселя Фейсбук

При детальном рассмотрении можно увидеть все события и количество посетивших сайт пользователей Facebook.

Читайте также: