Сбор аудиторий с Пиксель ВКонтакте

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

Как подключить пиксель Вконтакте

Перед выполнением подключения Пикселя ВКонтакте к сайту или странице нужно, чтобы у вас уже был свой аккаунт ВКонтакте.

1. Перейдите по этой ссылке и выберите внизу "Создать пиксель".

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

⚠️

Заметка: в поле "Разрешённый домен" укажите только имя основного домена, например, creatium.site или только имя основного поддомена, например, examples.creatium.site.

3. Скопируйте код пикселя и вставьте его в раздел "Плагины", создав плагин ”Свой код". в поле "Код перед </head>"

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

5. Совершите тестовые визиты на свой сайт с разных браузеров или устройств, чтобы статус пикселя сменился на "Работает".

Как настроить сбор аудиторий на основании выполняемых действий на странице?

К странице или сайту можно подключить следующие типы событий:

Посетитель открыл сайт;

Кто-то начал заполнять форму;

Заявка отправлена;

Не удалось отправить заявку;

Переход по ссылке;

Открыто окно.

⚠️

Заметка: события ”Заявка отправлена” или ”Не удалось отправить заявку” будет передано при условии, что в настройках формы выбрано любое действие, в котором есть действие ”Сообщение”.

Приступим к настройке событий:

1. Перед настройкой событий, необходимо подключить JS API, чтобы эти события могли быть переданы в аудиторию во ВКонтакте. Для этого откройте настройки сайта (проекта) в разделе "Свой код", поле "Body" и добавьте этот скрипт сразу после скрипта Пикселя ВКонтакте.

<script src="//vk.com/js/api/openapi.js?150"></script>

А в поле "Перед </body>" добавьте такой скрипт, предварительно скопировав выделенное значение на скриншоте из своего скрипта Пикселя ВКонтакте и добавив его вместо текста "Ваш_уникальный_код_пикселя_ретаргетинга".

<script>
  VK.Retargeting.Init("Ваш_уникальный_код_пикселя_ретаргетинга");
</script>

2. Посетитель открыл сайт - это событие будет собирать всех посетителей вашего сайта в отдельную аудиторию. По этому, изменим название ранее созданной аудитории с "Пример" на "Посетитель открыл сайт - (имя домена)".

Теперь откройте настройки этой же аудитории и скопируйте отображаемый id.

Вставьте этот id вместо "audienceID" в следующем скрипте и добавьте скрипт в поле "Перед </body>".

<script>
  VK.Retargeting.Hit();
  VK.Retargeting.Add(audienceID);
</script>

3. Создайте новые аудитории для оставшихся типов событий.

Название событий:

Кто-то начал заполнять форму - (имя домена);

Заявка отправлена - (имя домена);

Не удалось отправить заявку - (имя домена);

Переход по ссылке - (имя домена);

Открыто окно - (имя домена).

Параметры событий:

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

Пример второй аудитории:

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

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

⚠️

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

4. Перейдите в раздел "Плагины" и создайте плагин "Свой код". В нем, в поле "Код перед </body>" добавьте следующий скрипт:

ВАЖНО! Если ранее вы уже добавляли к сайту данный скрипт из других инструкций, то повторное добавление не требуется. В случае случайного или намеренного повторного добавления отправка данных будет дублироваться или это может привести к другим непредвиденным ошибкам.

<!--СКРИПТ ДЛЯ ОБЕСПЕЧЕНИЯ РАБОТЫ ИНТЕГРАЦИЙ-->
<script type="text/javascript">
  var date = new Date();
  var currentDate = String(date.getFullYear() + '-' + date.getMonth() + '-' + date.getDate());
  var initialization = document.createElement('script');
  initialization.type = 'text/javascript';
  initialization.src = 'https://i.1.creatium.io/disk/static/support-scripts/integration/integration.js?data=' + currentDate;
  initialization.charset = 'UTF-8';
  document.body.appendChild(initialization);
</script>

5. Проверить результат работы можно открыв страницу повторно и выполнив необходимые действия для передачи событий. Для просмотра информации по собранным аудиториям во ВКонтакте перейдите по ссылке.

Заметка: Новые пользователи в аудитории отображается не сразу же, а только в течение 20 - 40 минут после отправки события. Также, информация о событиях не будет передаваться если при посещении страницы был включен блокировщик рекламы, например, AdBlock, AdGuard и другие. По этому отключите его на своей странице перед проверкой пикселя на работоспособность.