Rose debug info
---------------

Web2app лендинги и как настроить Facebook Conversions API без разработчика

С апдейтом IOS14.5+ стали популярны рекламные кампании, которые ведут на web2app лендинги. Они позволяют закупать IOS трафик в Фейсбук и Инстаграм не через SKAD аттрибуцию, а по старому.

Что такое web2app лендинги
В двух словах схема простая.
Трафик закупаете в Фейсбук. Ведете на сайт. На сайте какой-то контент и кнопка скачать приложение. А по кнопке — переход в стор и установка приложения.

На кнопке стоит трекинговая ссылка в Appsflyer/Adjust и аттрибуция засчитается как propabalistic. Соответственно, вы нормально реал-тайм видите все конверсии по каждому креативу. Также можете подключить к закупке подрядчиков, так как нет ограничений на количество рекламных кампаний, как в случае с IOS14 кампаниями.

Примеры таких лендингов:

простая заглушка с картинкой и кнопкой

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

Например, квиз-онбординги у Simple Fasting или Blinkist:

Simple помогает похудеть с помощью интервального голодания
С Blinkist можно читать книги в кратком содержании

Проблема web2app
Проблема таких лендингов только в том, что тут оптимизация будет на евенты FB-пикселя, так как это веб. Т. е. в лучшем случае мы оптимизируем рекламу на тех, кто нажал кнопку скачать. Это скорее похоже на оптимизацию на установки. Но раньше то мы оптимизировались на евенты внутри приложения. И это очень сильно меняло всю воронку.

Настройка оптимизации на конверсии
Для того, чтобы web2app лендинг мог оптимизироваться на евенты из приложения нужно настроить Facebook Conversion API. Facebook CAPI умеет прокидывать евенты в Facebook прямо с сервера. То есть можно достать информацию откуда-то с бэка (например, CRM, Appsflyer) и пробросить конверсию обратно в facebook.

Есть официальный гайд от Фейсбука Но без  программиста будет сложно.

Когда я начал разбираться, я не нашел нигде простой инструкции. Поэтом накидал свою и собрал настройку на связке Facebook—Appsflyer-Zapier. Вы можете ей воспользоваться или по аналогии нормально настроить вместе с разработчиком.

Схема работы Facebook Conversions API для web2app

  1. Собираем необходимые параметры в Appsflyer
    На web2app лендинг добавляем Appsflyer Smart Script
. Он делает достаточно тупую и простую штуку. Во все ссылки, которые есть на лендинге, прокидывает дальше в Appsflyer параметры, которые вы добавили в хвост ссылки (например, utm_campaign и utm_source отправляет в af_sub1 и af_sub2).
  1. Достаем значения fbp и fbc переменных из кук Фейсбука
    Это куки Фейсбука. В fbp хранится уникальный индентификатор браузера пользователя, в fbc уникальный идентификатор клика по рекламе в Фейсбуке. Эти 2 параметра нам будет нужно сначала передать в Appsflyer, а потом обратно в Фейсбук через Conversion API.
<script type="text/javascript">

function getCookie(name) {

const value = `; ${document.cookie}`;
  
const parts = value.split(`; ${name}=`);
  
if (parts.length === 2) return parts.pop().split(';').shift();
};

</script>
  1. Достаем user-agent
    Помимо fbp и fbc нам еще понадобится user-agent и ip. Их также надо будет передать через Facebook Conversions API. IP мы возьмем из Appsflyer. А user-agent сохраним из браузера через window.navigator.userAgent
  1. Настраиваем генерацию и подмену всех ссылок на onelink ссылку с редиректом в аппстор
<script type="text/javascript">

window.onload = function () {

const onelinkGenerator = new window.AF.OneLinkUrlGenerator(

{
oneLinkURL: "https://YOUR.onelink.me/XXXX/",

pidKeysList: ['pid'],

campaignKeysList: ['c'],

campaignStaticValue:'none',

skipList: []

});


onelinkGenerator.setAdset("af_adset");

onelinkGenerator.setAd("af_ad");

onelinkGenerator.setCustomParameter("af_prt", "af_prt");

onelinkGenerator.setAfSub1("fbclid");

onelinkGenerator.setAfSub2("fbc",getCookie("_fbc"));

onelinkGenerator.setAfSub3("fbp",getCookie("_fbp"));

onelinkGenerator.setAfSub4("ua",window.navigator.userAgent);



const url = onelinkGenerator.generateUrl();
    

if (url) {
var anchors = document.getElementsByTagName("a");
for (var i = 0; i < anchors.length; i++) {
anchors[i].href = url;
}
}
    
};

</script>

Теперь на каждом клике по кнопке в Appsflyer, происходит редирект на вашу onelink ссылку и передаются параметры:


pid название источника, в который будут падать установки в Appsflyer. Например, pid=Facebook_web2app)

с, adset и ad содержат названия рекламной кампании, адсет и объявления
af_sub2 fbc

af_sub3 fbp
af_sub4 useragent

  1. Настраиваем связку Appsflyer PUSH API и Zapier.
    Делаем так, чтобы Appsflyer отправлял все нужные нам инсталы и еваенты в Zapier
в качестве Zapier может быть любой другой обработчик, который примет запрос, обработает и отправит дальше в Facebook в нужном виде
  1. Подключаем Conversions API
    В Zapier подключаем интеграцию с Facebook Conversions API и вашим бизнес-менеджером и рекламным кабинетом. Настраивается из коробки как одна из готовых интеграций.
  1. Отправляем нужные евенты в Facebook
    В Zapier настраиваем обработку запросов от Appsflyer, их фильтрацию, обработку и отправку дальше в Facebook
. Нам понадобится передать значения fbp, fbc, user-agent и ip клиента.

8. Профит!
Все настроено. Теперь в Facebook в Events Manager мы видим серверные евенты и можем использовать их для оптимизации рекламы

Подписаться на блог
Поделиться
Отправить
Запинить
Дальше