ADFOX Sites Help

Header Bidding

О технологии

Header Bidding — это programmatic-технология, которая позволяет в момент загрузки страницы сайта пользователем, опросить напрямую несколько подключенных DSP платформ и выбрать среди них предложение с максимальной ставкой.

Издатель должен заключить с каждым покупателем отдельный договор для торгов с применением технологии Header Bidding, который не относится к Яндекс или ADFOX.

Как работает Header Bidding?
1. В момент загрузки страницы сайта пользователем специальный код Header_bidding.js одновременно отправляет запросы всем подключенным покупателям и они конкурируют за показ на единых условиях, делая свои ставки.
2. Все ставки от покупателей приходят к серверу ADFOX вместе с рекламным запросом и сравниваются с CPM других кампаний вида "Динамическая монетизация" (если такие имеются в аккаунте издателя). Выбирается кампания с максимальной ставкой.
3. Кампания с максимальной ставкой перевзвешивается с Рекламной сетью Яндекса для выбора победителя:
3.1. Если РСЯ предлагает ставку больше, то РСЯ побеждает и получает право показать свою рекламу.
3.2. Если РСЯ не может предложить ставку больше или отказывается от участия в торгах, то побеждает рекламная кампания с максимальной ставкой и получает право показать свой баннер.

Преимущества использования Header Bidding для издателя:

  • удобный способ подключения внешних монетизаторов;
  • увеличение эффективности за счет учета ставок внешних монетизаторов в рамках ДМ;
  • снижение потерь трафика при схеме классических "водопадов";
  • сокращение времени для отрисовки рекламы за счет исключения "лишних" звеньев из водопада.

На данный момент интеграция возможна с покупателями (список будет пополняться):
Criteo (в том числе с нативной рекламой);
Soloway;
HPMD(Happy Monday);
Buzzoola;
Mytarget;
Facebook;
Between Digital;
All in One Media;
GetIntent.


Настройка аккаунта ADFOX

Обратитесь в службу технической поддержки для подключения функционала "Динамическая монетизация", "Внешняя монетизация" и "Монетизация header bidding".

Для запуска внешней монетизации выполните все этапы настройки. Важно, чтобы прослеживалась связь с монетизатором для ряда объектов:
* в типе баннера шаблон для монетизатора N
* рекламная кампания, в параметрах которой указан внешний монетизатор N
* баннер в рекламной кампании, созданный с шаблоном монетизатора N
* на сайте должен быть скрипт с настройками для запросов ставок от площадок к монетизатору N

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

1.1 К типам баннеров добавьте шаблоны для внешних монетизаторов header bidding.
Перейдите в меню Настройки → Типы баннеров → Собственные → Безразмерные и кликните на значок Шаблоны .
Нажмите "Использовать предзаданный" и добавьте в тип баннера шаблоны для покупателей.
Шаблоны, подходящие для использования с header bidding технологией, именуются так:

Header Bidding {название покупателя} [loader]  

2. Определите площадки для размещения покупателей и при необходимости создайте новые площадки.

3. Для каждого покупателя добавьте одну рекламную кампанию и в параметре Внешний монетизатор укажите покупателя.

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

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

Например, если рекламная кампания создана для покупателя Criteo, а в тип баннера был добавлен шаблон "Header Bidding HPMD [loader]", то при добавлении баннера в такую кампанию, нельзя будет выбрать тип баннера, потому что в нем нет подходящего шаблона "Header Bidding Criteo [loader]".

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

5. На сайте издателя все площадки, участвующие в Header Bidding, должны использовать коды вставки с библиотекой loader.js.


Настройка сайта

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

Объект с настройками добавьте в неймспейс window.YaHeaderBiddingSettings

window.YaHeaderBiddingSettings = {
    biddersMap: BiddersMap;
    adUnits: AdUnit;
    timeout: Timeout;
}

biddersMap — объект с парами 'ключ': 'значение', где:

ключ — название покупателя в одинарных кавычках (см. в Таблице покупателей);

значение — идентификатор рекламной кампании, созданной на 11 уровне Динамической монетизации, для данного покупателя, в одинарных кавычках.

'betweenDigital': '787336'

adUnits — массив объектов с информацией о том, среди каких покупателей разыгрывать объявления.

  AdUnit [
      {
          code: string; 
          sizes: Sizes; 
          bids: [
              {
                  bidder: string; // ключ покупателя
                  params: any; // настройки для конкретного покупателя.  
              }
          ];
      }
  ]

code — идентификатор контейнера для баннера (равен containerId в коде вставки ADFOX);
sizes — размеры баннера, обязательный параметр для Soloway и Between Digital. Массив массивов, в котором 1-ое значение ширина, а 2-ое - высота.

sizes: [[ 728, 90 ]];

bids — данные о покупателях, подключенных к торгам для этой площадки, представляет собой массив объектов:

bidder — название покупателя см. столбец ключ в Таблице покупателей;
params — объект с парами 'параметр площадки': 'значение', где:

параметр площадки — настройка для конкретного покупателя (см. столбец "Параметр площадки в params" в Таблице покупателей);
значение — идентификатор площадки покупателя, необходимо его получить от покупателя.

{bidder: 'betweenDigital', params: {placementId: 8}}

timeout — время ожидания ответа от сервера покупателя, рекомендуемое время 500мс (максимально возможное 3000мс, но в таком случае скорость загрузки основного контента сайта будет производиться с задержкой).

Таблица с данными покупателей

ПокупательКлюч покупателяНеобходимость передачи sizes в adUnitsID среза в Партнёрском ИнтерфейсеПараметр площадки в params
Criteocriteoнет222placementId
Solowayadriverда333
HPMDhpmdнет666
Buzzoolabuzzoolaнет777
MytargetmyTargetнет444
Facebookfacebookнет888
Between DigitalbetweenDigitalда1110
All in One Mediaaioнет1554
GetIntentgetintentнет1665

ID среза автоматически подставляется к запросу и дает возможность собирать отдельную статистику по срезам в Партнерском интерфейсе.

Примечание. Для покупателей Criteo и Soloway ранее использовались параметры площадки zoneid и siteid. С ними сохранена обратная совместимость, но рекомендуем перейти на использование placementId.

2. Подключите скрипты:
• в любом месте страницы асинхронно скрипт header-bidding.js;
• в head страницы один раз библиотеку loader.js.

<script async src="https://yastatic.net/pcode/adfox/header-bidding.js"></script>
<script src="https://yastatic.net/pcode/adfox/loader.js" crossorigin="anonymous"></script>


Пример подключения скриптов

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

3. Подключение нативной рекламы Criteo

Документация Criteo по нативной рекламе.
В массиве adUnits найдите значение code, для которого нужно добавить нативную рекламу.
В объект bids добавьте параметр nativeCallback, содержащий в себе функцию function(json), где json — объект, полученный в ответе от Criteo.
Далее напишите функцию, распоряжающуюся этим содержимым, вставляющую его в вёрстку, итд.

Если в function(json), как и в нашем примере, используется вызов функции, то она должна быть объявлена в глобальной области видимости.

const adfoxBiddersMap = {
    'criteo': '781965'
};

var adUnits = [{
    code: 'adfox_151663576557768486',
    bids: [{
        bidder: 'criteo',
        params: {
            placementId: 1168582,
            nativeCallback: function(json) {
                renderCriteo(json);
                console.log('Hello world');
            }
        }
    }
]

}];
var userTimeout = 500;

window.YaHeaderBiddingSettings = {
    biddersMap: adfoxBiddersMap,
    adUnits: adUnits,
    timeout: userTimeout
};

4. Решение для сайтов с "бесконечной" прокруткой

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

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

window.Ya.headerBidding.pushAdUnits(AdUnit[])

где вместо AdUnit[] — укажите массив объектов с информацией о том, к каким покупателям делать запрос ставок для новых добавленных рекламных мест.

Метод pushAdUnits необходимо вызывать до adfoxCode.create для нового баннерного места.

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

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

<div id="adfox_15218"></div>
<script>
    window.Ya.headerBidding.pushAdUnits([
    {
            code: 'adfox_15218',
        sizes: [[728, 90]],
        bids: [{
            bidder: 'adriver',
            params: {placementId: 'adfox_test'}
        }]
    }
    ]);
    window.Ya.adfoxCode.create({
            ownerId: 168627,
            containerId: 'adfox_15218',
            params: {
                p1: 'bzzvh',
                p2: 'fvxb'
            }
    });
    </script>

Пример подключения скриптов и настройки конфигурационного скрипта

    <head>       
    <script async src="https://yastatic.net/pcode/adfox/header-bidding.js"></script>
    <script>
    const adfoxBiddersMap = {
        'criteo': '710398',
        'adriver': '737037',
        'hpmd': '737040'
    };
    var adUnits = [
        {
            code: 'adfox_1',
            bids: [
                {
                    bidder: 'criteo',
                    params: {
                        placementId: 917087,
                    }
                }
            ]
        },
        {
            code: 'adfox_2',
            sizes: [[ 728, 90 ]],
            bids: [
                {
                    bidder: 'criteo',
                    params: {
                        placementId: 917087,
                    }
                },
                {
                    bidder: 'adriver',
                    params: {
                        placementId: 762890
                    }
                }
            ]
        },
        {
            code: 'adfox_3',
            bids: [
                {
                    bidder: 'hpmd',
                    params: {
                        placementId: '2360'
                    }
                }
            ]
        }
    ];
    var userTimeout = 500;
    window.YaHeaderBiddingSettings = {
        biddersMap: adfoxBiddersMap,
        adUnits: adUnits,
        timeout: userTimeout
    };
</script>
<script src="https://yastatic.net/pcode/adfox/loader.js" crossorigin="anonymous"></script>
</head>
<body>
<div id="adfox_1"></div>
<script>
    window.Ya.adfoxCode.create({
        ownerId: 255196,
        containerId: 'adfox_1',
        params: {
            pp: 'g',
            ps: 'cnsf',
            p2: 'frnp'
        }
    });
</script>
<div id="adfox_2"></div>
<script>
    window.Ya.adfoxCode.create({
        ownerId: 255196,
        containerId: 'adfox_2',
        params: {
            pp: 'g',
            ps: 'cnsh',
            p2: 'frnq'
        }
    });
</script>
<div id='adfox_3'></div>
<script>
    window.Ya.adfoxCode.create({
        ownerId: 255196,
        containerId: 'adfox_3',
        params: {
            pp: 'g',
            ps: 'cnsh',
            p2: 'frny'
        }
    });
</script>
</body>

Инструмент для проверки ставок покупателей

В консоли браузера вызовите метод:

window.Ya.headerBidding.getBidsReceived();

Например:

В ответе будет массив, содержащий:
ставку:

Bid {
    cpm: number; // размер ставки (целый в рублях)
    displayUrl: string; // url с баннером
    params: any; // объект с различными дополнительными параметрами, разный для различных dsp
    adapterName: string; // имя покупателя
    containerId: string; // id контейнера
    campaignId: number; // id рекламной кампании 
}

или ошибку:

BidError {
    errorCode: number; // номер ошибки
    adapterName: string; // имя покупателя
    containerId: string; // id контейнера
    campaignId: number; // id рекламной кампании
}

Расшифровка номеров ошибок:
0 — неизвестная ошибка;
1 — отсутствие ставки/ответа;
2 — некорректный ответ;
3 — таймаут;
4 — ошибка HTTP протокола;
5 — некорректные пользовательские данные в конфигурационном скрипте;
6 — некорректные настройки биддера (только для Facebook).