Ретаргетинг ВКонтакте

1. Подключите openapi.js и инициализируйте пиксель

— Асинхронное подключение

<script>
  // переменная для хранения экземпляра пикселя
  var pixel;

  // вызовется после загрузки openapi.js
  window.vkAsyncInit = function() {
    pixel = new VK.Pixel('VK-RTRG-96471-KZ24cpR');
  }
</script>
<script src="//vk.com/js/api/openapi.js?159" async></script>

— Асинхронное подключение (подходит для Google Tag Manager)

<div id="vk_api_transport"></div>
<script>
  var pixel;

  window.vkAsyncInit = function() {
    pixel = new VK.Pixel('VK-RTRG-162959-e0J6d');
  };

  setTimeout(function() {
    var el = document.createElement("script");
    el.type = "text/javascript";
    el.src = "https://vk.com/js/api/openapi.js?159";
    el.async = true;
    document.getElementById("vk_api_transport").appendChild(el);
  }, 0);
</script>

— Синхронное подключение (не рекомендуется)

<script src="//vk.com/js/api/openapi.js?159"></script>
<script>var pixel = new VK.Pixel('VK-RTRG-96471-KZ24cpR');</script>

2. Используйте методы JS API

Вызывайте методы в момент совершения пользователем интересного вам действия. Самый простой пример — добавить код в атрибут onclick кнопки:

<button onclick="pixel.Event('click-save-button')">
    Сохранить
</button>

Доступно три метода: посещение страницы (совпадает с тем, как работал пиксель до появления событий и JS API), генерация события и добавление в аудиторию. Подробнее о них:

pixel.Hit()

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

Например: для аудитории «Посетители раздела "Мужская обувь"» задано правило: «URL содержит /catalog/men-shoes/». Тогда, вызвав этот метод со страницы с адресом https://example.com/catalog/men-shoes/summer/, пользователь будет сохранён в этой аудитории.

pixel.Event(eventName)

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

Например: для аудитории «Начавшие заполнять анкету» задано правило: «Событие совпадает с form-fill-started». Тогда, сгенерировав такое событие в момент начала заполнения анкеты, пользователь будет сохранён в этой аудитории.

var formFillStarted = false;
$('form').on('change', function () {
    if (!formFillStarted) {
        formFillStarted = true;
        pixel.Event('form-fill-started');
    }
});

pixel.Add(audienceID)

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

Например: требуется собрать всех пользователей, добавивших товар в корзину, в соответствующую аудиторию.

$('.add-to-basket').on('click', function () {
    pixel.Add(8839163);
});