Как добавить YouTube Shorts на Tilda
Если с Zero блоком все понятно. Берем и вставляем ссылку.
То как вставить Ютуб Шортс в обычный блок или в Popup (попап)? Туда он не идет, только обычное видео.
Инструкция:
По факту, все очень просто. Нажимаем левой кнопкой мыши на наш Шортс и копируем HTML-код (смотри скрин)
Далее вставляем его в блок T123 (HTML-код) или T868 (Popup: HTML-код в попапе).
Чтобы отцентровать Шортс в попапе, нужно чуть-чуть поработать с кодом.
Добавьте эти 2 строки к имеющемуся html-коду из ютуб:
То как вставить Ютуб Шортс в обычный блок или в Popup (попап)? Туда он не идет, только обычное видео.
Инструкция:
По факту, все очень просто. Нажимаем левой кнопкой мыши на наш Шортс и копируем HTML-код (смотри скрин)
Далее вставляем его в блок T123 (HTML-код) или T868 (Popup: HTML-код в попапе).
Чтобы отцентровать Шортс в попапе, нужно чуть-чуть поработать с кодом.
Добавьте эти 2 строки к имеющемуся html-коду из ютуб:
1 строка - <p align="center">
2 строка - html код Шортса из YouTube
3 строка - </p>
В коде можно менять разные атрибуты для адаптации под ваш сайт.
Атрибуты <video>
С помощью атрибутов мы можем настроить кнопки управления, зацикливание видео и другие параметры.
Атрибут style имеет разные свойства:
autoplay="autoplay" (удали значение, если не надо, чтобы видео автовоспроизводилось)
controls="" (удали значение, если на видео не нужны элементы управления видеоплеером)
loop="loop" (удали значение, если не нужно зацикливание видео)
playsinline="" (контролирует воспроизведение видео на мобильных устройствах. Обычно видео открывается в полноэкранном режиме, но этот атрибут позволит запретить такое поведение, оставив видео в рамках элемента)
poster="" (добавьте постер поверх видео, когда видео еще не загружено будет показываться эта картинка вместо черного экрана)
Атрибут style имеет разные свойства:
- object-fit: cover; (сохраняет пропорции исходного изображения при подстройке под нужные нам размеры. Имеет другие доступные значения)
- background-size: cover; (Управляет размерами видео внутри элемента, для которого это видео задано фоном. Имеет другие доступные значения)
- width: 100%; (Ширина заполняемого элемента)
- height: 100%; (Высота заполняемого элемента)
- border-radius: 15px; (Радиус скругления заполняемого элемента)
autoplay="autoplay" (удали значение, если не надо, чтобы видео автовоспроизводилось)
controls="" (удали значение, если на видео не нужны элементы управления видеоплеером)
loop="loop" (удали значение, если не нужно зацикливание видео)
playsinline="" (контролирует воспроизведение видео на мобильных устройствах. Обычно видео открывается в полноэкранном режиме, но этот атрибут позволит запретить такое поведение, оставив видео в рамках элемента)
poster="" (добавьте постер поверх видео, когда видео еще не загружено будет показываться эта картинка вместо черного экрана)