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.

Демо-страница
Демо-страница для мобильных устройств

Настройка аккаунта 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.

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

В тег head подключите последовательно скрипты:

1. Подключите к сайту синхронно скрипт header-bidding.js:

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

2. Создайте скрипт с настройками для запросов ставок и добавьте их в тег script:

  window.Ya.headerBidding.setSettings(Settings) - установка настроек.

  Settings {
      biddersMap: BiddersMap;
      adUnits: AdUnit;
      timeout: Timeout;
  }

**biddersMap** — объект с парами '*ключ*': '*значение*', где:  
*ключ* — название покупателя (для Criteo ключ <span class="tag_text">'criteo'</span>, для Soloway ключ <span class="tag_text">'adriver'</span>);  
*значение* — идентификатор рекламной кампании, созданной на 11 уровне Динамической монетизации, для данного покупателя.  

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

  AdUnit [
      {
          code: string; // идентификатор элемента, который является контейнером для баннера (равен containerId в коде вставки ADFOX); 
          sizes: Sizes; // обязательный параметр для покупателя Soloway. Размеры баннера. Массив массивов, в котором 1-ое значение ширина, а 2-ое - высота. Например: sizes: [[ 728, 90 ]]
          bids: [
              {
                  bidder: string; // имя покупателя
                  params: any; // настройки для конкретного покупателя. Например, для Criteo - поле zoneid, для Soloway - siteid, для HPMD - placementId. Значения идентификаторов необходимо получить от покупателей.
              }
          ];
      }
  ]

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

3. Библиотека loader.js должна подключаться только после инициации всех скриптов для header bidding.

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

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

Пример кода

    <head>       
    <script 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: {
                        zoneid: 917087,
                    }
                }
            ]
        },
        {
            code: 'adfox_2',
            sizes: [[ 728, 90 ]],
            bids: [
                {
                    bidder: 'criteo',
                    params: {
                        zoneid: 917087,
                    }
                },
                {
                    bidder: 'adriver',
                    params: {
                        siteid: 762890
                    }
                }
            ]
        },
        {
            code: 'adfox_3',
            bids: [
                {
                    bidder: 'hpmd',
                    params: {
                        placementId: '2360'
                    }
                }
            ]
        }
    ];
    var userTimeout = 500;
    window.Ya.headerBidding.setSettings({
        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 рекламной кампании
}