Баннер

Баннер — это универсальный блок, размер которого адаптируется под размер обрамляющего контейнера на странице. Блок доступен для показа на разных устройствах: десктопе, мобильных и AMP-страницах.

В баннере могут быть показаны следующие форматы рекламы:

  • текстово-графические объявления формата Адаптивный . Дизайн текстово-графических объявлений формируется автоматически по технологии Smart Design. Технология определяет, какое объявление с большей вероятностью привлечет внимание пользователя, и собирает его из доступных дополнений.

  • медийная реклама разных форматов: как фиксированная, так и адаптивная;

  • видеореклама.

Пример баннера с текстово-графическим объявлением

Как создать баннер

  1. В интерфейсе Рекламной сети Яндекса перейдите на вкладку Реклама на сайтах → Блоки и нажмите Добавить блок.

  2. Выберите сайт, для которого вы создаете блок, и нажмите Дальше.

  3. Выберите тип блока Баннер.

  4. Введите название блока для использования в интерфейсе Рекламной сети Яндекса.

  5. Установите порог CPM:

    • Максимальный доход — минимальная стоимость показа рекламы будет определяться автоматически. Эта опция позволяет оптимально заполнить рекламные места и максимизировать доход владельца сайта.

    • Порог CPMV — вы самостоятельно определяете минимальную стоимость тысячи показов с учетом проверки видимости. Порог CPMV устанавливается в рублях, долларах или евро. Изменить валюту порога можно в настройках аккаунта.

      Внимание

      Установка порога CPMV может снизить заполняемость блока рекламой и, соответственно, ваш доход.

  6. Для размещения блока на AMP-страницах в поле Блок для AMP выберите соответствующее значение. Для размещения на десктопной и мобильной версий сайта оставьте значение Нет. Расположение блока (в контенте, над шапкой, в ленте рекомендаций или Floor Ad) настраивается в интерфейсе Вебмастера.

    Примечание

    На десктопной и мобильной версиях сайта можно размещать один и тот же блок: он будет показан на всех устройствах. Блоки, созданные для AMP-страниц, можно размещать только на AMP-страницах.

  7. При необходимости укажите размеры блока — они будут применяться ко всем форматам внутри блока. Выберите одну из опций:

    • Адаптивный — размер блока ограничен только размерами обрамляющего контейнера на сайте. Для баннера размер обрамляющего контейнера вы указываете самостоятельно в верстке сайта, и именно это определяет, какие форматы рекламы могут быть показаны в блоке. Рекомендации, как определить размеры контейнера, читайте в разделе Настройка размеров блока.

    • Адаптивный с ограничениями — позволяет задать максимальные и минимальные значения для высоты и ширины блока в пикселях. В этом случае при подборе рекламы учитываются как размеры контейнера на сайте, так и ограничения, заданные в интерфейсе Рекламной сети.

      Если минимальное значение не задано, по умолчанию реклама для десктопного Floor Ad занимает 90 пикселей по высоте и не более указанного максимального значения по ширине. Для всех остальных блоков — не менее 40% контейнера по высоте и 70% контейнера по ширине.

    • Фиксированный — позволяет определить точные размеры блока в пикселях. В блоке будет показана реклама только заданного размера (при условии, что размер блока меньше размера контейнера на сайте).

    Примечание

    Выбирая размеры Адаптивный с ограничениями и Фиксированный, учитывайте требования к размерам у фиксированных форматов медийной рекламы. Для показа этих форматов необходимо, чтобы размер блока точно соответствовал размеру медийного баннера или был больше баннера.

    Подробнее о требованиях к размерам в зависимости от формата рекламы читайте в разделе Настройка размеров блока.

  8. Настройте рамку для текстово-графических объявлений и видеорекламы:

    • Наличие рамки — выберите значение:

      • Авто — наличие рамки определяется алгоритмами Рекламной сети Яндекса для каждого конкретного показа;
      • Да— рамка есть всегда;
      • Нет— всегда без рамки.

    • Углы рамки — выберите вид углов:

      • Авто — форма углов определяется алгоритмами Рекламной сети Яндекса для каждого конкретного показа;
      • Прямые;
      • Закругленные.

    Подробнее о свойствах рамки в рекламных форматах

    Формат

    Свойства рамки и углов

    Текстово-графические объявления

    • Цвет рамки серый (#dddcda).

    • Если контейнер занимает всю ширину окна, то рамка будет отображаться только сверху и снизу, а углов не будет.

    • Рамка отображается, только если фон объявления белого цвета.

    • Если рекламное изображение темное или яркое, рамка будет только вокруг текстовой части.

    Смарт-баннеры

    • Цвет рамки серый (#dddcda).

    • Если контейнер занимает всю ширину окна, то углов не будет, а рамка будет отображаться только сверху и снизу.

    Видеореклама

    • Цвет рамки серый (#dddcda).

    • Если контейнер занимает всю ширину окна, то углов не будет, а рамка будет отображаться только сверху и снизу.

    • Рамка не отображается, если у видеоролика нет дополнений или если их фон не белого цвета.

  9. Выберите тему: Темная или Светлая. По умолчанию выбрана светлая тема. Блоки в темной теме отличаются не только фоном, но и цветом текста, рамки, кнопок и других элементов рекламы. Выбранная тема применяется ко всем форматам в блоке.

  10. Определите настройки интерскроллера: если опция включена, реклама будет плавно появляться из-под контента при прокрутке и скрываться под ним с использованием параллакс-эффекта. По умолчанию (опция Авто) показ в интерскроллере отключен.

    Примечание

    Если вы включили интерскроллер, при размещении блока на сайте убедитесь, что на родительских элементах блока не используются свойства transform, perspective или filter.

  11. Выберите способ настройки рекламных форматов:

    • Использовать стандартные настройки — при выборе этой опции в блоке будут показаны все доступные форматы: текстово-графические объявления, медийная реклама и видеореклама. Дизайн рекламы определяется автоматически.

    • Настроить форматы самостоятельно — в этом случае вы можете отключить показ некоторых форматов или изменить их дизайн:

      Основной дизайн — это текстово-графические объявления формата Адаптивный . Для этого формата можно настроить:

      Максимальное количество объявлений

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

      Способ размещения объявлений в блоке

      Если в блоке больше одного объявления, можно задать их расположение:

      • Авто — автоматически с учетом размеров контейнера;

      • Слева направо — для горизонтального контейнера;

      • Сверху вниз — для вертикального контейнера.

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

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

      1. Выберите тип устройства с помощью опции : десктопное или мобильное.

      2. В поле Контейнер настройте размер контейнера: вы можете выбрать значение из списка или задать размер самостоятельно, выбрав Пользовательский.

      Примечание

      Заданный размер контейнера используется только для формирования области предпросмотра и не сохраняется в настройках блока. При размещении блока укажите размеры контейнера в верстке сайта.

      Медийная реклама подбирается автоматически с учетом размеров блока.

      Чтобы отключить формат, переведите его в положение «Выключен».

      Видеореклама подбирается автоматически с учетом размеров блока. Минимальная площадь блока должна составлять 320 × 180 пикселей, где одна из сторон — не меньше 180 пикселей. В блоках меньшего размера видеореклама не будет показана (даже если в настройках блока формат включен).

      Чтобы отключить формат, переведите его в положение «Выключен».

  12. Нажмите Создать. Откроется окно с кодом вставки. Используйте этот код для размещения блока на страницах сайта.

После сохранения блоку будет присвоен уникальный идентификатор (ID). Он состоит из идентификатора продукта (R-A), идентификатора площадки (site_id) и порядкового номера блока.

Внимание

На одной странице сайта нельзя размещать блоки с одинаковыми идентификаторами. Если вы хотите создать еще один блок с такими же настройками, в списке блоков найдите нужный блок и нажмите Ещё → Дублировать. Появится дубликат блока с новым ID.

Как разместить баннер на сайте

Порядок размещения блока зависит от версии сайта:

  1. Получите код вставки: в настройках блока нажмите Получить код.

  2. Скопируйте код загрузчика рекламы в буфер обмена и вставьте его в начало страницы сайта между тегами <head> и </head>. Код загрузчика устанавливается на страницу один раз и используется для вызова всех блоков Рекламной сети Яндекса.

  3. Скопируйте код рекламного блока в буфер обмена и вставьте его в обрамляющий контейнер в той части страницы, где вы планируете показывать рекламу. Контейнер и блок должны находиться внутри элемента <body/>.

Примечание

Рекомендуем копировать код только с помощью кнопки Копировать в буфер обмена. При копировании другими способами текстовый редактор может прерывать и переносить длинные строки, и JavaScript-код с такими строками может работать некорректно.

При размещении кода убедитесь, что:

  • код рекламных блоков, которые должны отображаться первыми, вставлен как можно раньше;

  • код вставки не помещен в скрытый DOM-узел или в iframe;

  • рекламу на странице не перекрывают другие блоки и элементы;

  • в консоли браузера отсутствуют ошибки, связанные с кодом вставки.

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

  1. Получите код вставки: в настройках блока нажмите Получить код.

  2. Внесите изменения в код страницы сайта:

    Блок в контенте

    1. В <head> добавьте скрипт с компонентом amp-ad.

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

    3. Измените значение параметра height на высоту, которую вы задали для блока. В коде вставки высота по умолчанию — 320 пикселей.

    Блок вида Floor Ad

    1. В <head> добавьте скрипт с компонентом amp-sticky-ad.

    2. Оберните код рекламного блока в теги:

      <amp-sticky-ad layout="nodisplay">
// код рекламного блока
</amp-sticky-ad>

    3. Настройте параметры блока:

      • width — ширина в пикселях;

      • height — высота в пикселях (максимальное значение — 100);

      • удалите параметр layout="fixed-height".

    4. Вставьте код в том месте страницы сайта, где вы планируете показывать блок.

      Пример кода вставки Floor Ad
      <amp-sticky-ad layout="nodisplay">
<amp-ad
    width="350" 
    height="100"
    type="yandex" 
    data-block-id="R-A-123456-1"
    data-html-access-allowed="true">
</amp-ad>
</amp-sticky-ad>
    Другой блок

    Вы можете устанавливать баннеры в разные виды блоков в соответствии с требованиями документации AMP.

Примечание

Код блока для AMP-страниц отличается от кода блока для других версий сайта. Если вы разместите такой блок на обычном сайте, показов рекламы не будет.

Обратиться в службу поддержки

Написать в WhatsApp Перейти в WhatsApp
Написать в Telegram Перейти в Telegram

Написать в чат

Написать письмо



Также вы можете перейти на сервис



Полезные ссылки



Показ считается видимым, если не менее 50% площади блока находится в видимой зоне экрана не менее двух секунд.

Предыдущая
Типы блоков
Следующая
Полноэкранный