Воспроизведение видео на устройствах c iOS без перехода в полноэкранный режим

Издатели Google Менеджера рекламы требуют во все видео в баннерах добавлять атрибут playsinline. Это позволяет повысить эффективность объявлений и удобство их просмотра. При наличии этого атрибута видеокреативы в баннерах не раскрываются во весь экран автоматически.

Начиная с июня 2019 г. все видеокреативы HTML5 для показа в баннерах, не имеющие атрибута playsinline, перестанут допускаться к аукционам в Дисплее и Видео 360. Чтобы это нововведение не повлияло на показ ваших креативов, обеспечьте воспроизведение всех видео указанного типа в нераскрытом виде. Использовать атрибут playsinline при прямом алгоритмическом размещении необязательно.

Примечание. Атрибут webkit-playsinline не поддерживается. Используйте атрибут playsinline.

Как настроить воспроизведение в нераскрытом виде

Google Web Designer

Во все креативы, созданные с помощью Google Web Designer версии 5.0.4.0226, после 14 марта 2019 г. по умолчанию включен нужный атрибут (playsinline). Если ваши рекламные материалы были созданы раньше этой даты, обновите Google Web Designer до последней версии, а затем опубликуйте их повторно.

HTML

Добавьте атрибут playsinline в каждый элемент video в своем HTML-коде. Этот атрибут является логическим, поэтому указать его сам по себе – то же самое, что присвоить ему значение "истина".

<video id="video1" controls="controls" poster="image.jpg" playsinline>

      <source type="video/mp4" src="video.mp4" />

      <source type="video/ogg" src="video.ogg" />

      <source type="video/webm" src="video.webm" />

      </video>

Проигрыватель YouTube

Если вы создаете в Google Web Designer объявления с проигрывателем YouTube, при необходимости измените креативы в соответствии с инструкциями в разделе Google Web Designer выше.

Если вы используете API проигрывателя YouTube, укажите в коде параметр playsinline.

<iframe id="ytplayer" type="text/html" width="720" height="405"

      src="https://youtube.com/embed/M7lc1UVf-VE?playsinline=1"

      frameborder="0" allowfullscreen>

Эта информация оказалась полезной?

Как можно улучшить эту статью?