Форум Монетизация сайтов Рекламная Сеть Яндекса

РСЯ: как управлять размером медийных баннеров?

Diarr-Hea

27 марта 2020, 15:57

502

Есть в дизайне блоков фиксированный формат, которым можно управлять через media-queries, указывая width и height. Можно ли таким образом управлять форматом медийных баннеров или яндекс будет подставлять в мобильной версии баннеры 1000 на 250, например?

Или единственный вариант в 2k20 - это создавать для каждой позиции несколько вариантов блоков для ПК, планшета и мобил.

И еще посмотрите, пожалуйста, какой процент видимости рекламы с Дизайн ID = 0 (т.е. медийка). У меня в марте до 5% видимости упало, хотя для каждого блока созданы блоки для ПК, планшета и мобил.

339

Дмитрий Громов

30 марта 2020, 09:16

Diarr-Hea:
Есть в дизайне блоков фиксированный формат, которым можно управлять через media-queries, указывая width и height. Можно ли таким образом управлять форматом медийных баннеров или яндекс будет подставлять в мобильной версии баннеры 1000 на 250, например?

Или единственный вариант в 2k20 - это создавать для каждой позиции несколько вариантов блоков для ПК, планшета и мобил.

Добрый день! Формат Директ «Настраиваемый» позволяет управлять шириной контейнера в таблице стилей сайта — https://yandex.ru/support/partner2/web/products-rtb/partner-code.html#partner-code__adaptive-css

В конструкторе Директ выберите:

тип - фиксированный,
ориентация - указать размеры вручную (свой размер),
формат - Настраиваемый.

Данная настройка будет распространяться только на Директ, но не на Медийную рекламу.

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

Для того, чтобы рекламный блок, отображался на мобильной версии сайта (при ширине экрана менее 768px) одним образом, а на десктопе (например, при ширине экрана устройства свыше 1000px) другим образом, нужно в интерфейсе РСЯ создать два блока с подходящими для этих версий сайта настройками (например, блок с небольшими размерами для мобильного сайта и большой блок для десктопа). Перед установкой на сайт стандартный javascript-код этих блоков (полученный по кнопке "Получить код") нужно заменить на адаптивный Javascript, который учитывает ширину вьюпорта и в зависимости от нее загружает или не загружает RTB-блок на страницу сайта.

Коды этих двух блоков нужно установить рядом в html-код страницы.

Если вы хотите, чтобы блок отображался только на мобильной версии сайта (до 768px), можно использовать следующий код (добавив его на место блока и заменив «ID блока» на нужный ID):

(function(w, d, n, s, t){

if (window.matchMedia("only screen and (max-device-width: 768px)").matches){

w[n] = w[n] || [];

w[n].push(function() {

Ya.Context.AdvManager.render({

blockId: ID блока ,

renderTo: "yandex_ad1",

async: true

});

t = d.getElementsByTagName("script")[0];

s = d.createElement("script");

s.type = "text/javascript";

s.src = "//an.yandex.ru/system/context.js";

s.async = true;

t.parentNode.insertBefore(s, t);

}

})(this, this.document, "yandexContextAsyncCallbacks");

</script>

Этот блок будет пропадать на десктопной версии (свыше 768px).

id="yandex_ad1" так же должен быть уникальным на странице (то есть, для нескольких блоков нужно использовать id="yandex_ad1", id="yandex_ad2" и т.д.)

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