Как вставить видео YouTube на сайт (адаптивно)
Вставьте видео YouTube, которое подстраивается под любой экран: меню «Поделиться», адаптивный код, время начала, режим конфиденциальности, WordPress и скорость.
Создайте чистый адаптивный код для встраивания любого видео YouTube — с временем начала, автозапуском, повтором и настройками конфиденциальности.
Вставьте ссылку, чтобы получить код.
Встроенное видео YouTube удерживает посетителей на вашей странице, а трансляцией занимается YouTube. Базовый код из окна «Поделиться» работает, но это жёсткий блок 560×315, который не подстраивается под телефон и скрывает полезные настройки вроде времени начала и окончания. Этот генератор создаёт чистый адаптивный код, где все параметры — простые флажки, и показывает живой предпросмотр перед копированием.
| Параметр | В коде | Полезно знать |
|---|---|---|
| Начать с / Закончить на | start=85&end=140 | Время в секундах; можно ввести 1:25 — инструмент пересчитает |
| Адаптивно | width:100%; aspect-ratio:16/9 | Заполняет колонку на любом экране; отключите для фиксированного размера |
| Повышенная конфиденциальность | youtube-nocookie.com | Никаких cookie YouTube до нажатия на воспроизведение |
| Автовоспроизведение | autoplay=1&mute=1 | Браузеры разрешают автозапуск только без звука |
| Повтор | loop=1&playlist=ID | Чтобы одно видео повторялось, YouTube нужен параметр playlist |
| Элементы управления | controls=0, если выключено | Без кнопок — для фоновых видео, не для уроков |
| Субтитры | cc_load_policy=1 | Показывает субтитры по умолчанию, если они есть |
Кроме того, в коде есть loading="lazy" — плеер грузится, только когда посетитель докрутит до него, — и понятный title для программ экранного доступа.
<body>, где должно быть видео.Shorts тоже можно встроить — генератор превратит ссылку /shorts/ в обычный embed. Поскольку они вертикальные, отключите «Адаптивно» и задайте размер вроде 315 × 560, чтобы не получилась широкая рамка с чёрными полосами.
Нужна ссылка вместо плеера? Генератор ссылок с таймкодом делает ссылки, которые начинаются с нужного момента. Пошаговые инструкции для разных конструкторов — в статье как встроить видео YouTube на сайт.
Вставьте ссылку в генератор, выберите параметры и нажмите «Копировать код». Затем вставьте iframe на страницу: в WordPress — через блок «Произвольный HTML», в Blogger — в режиме HTML, в Tilda — через блок HTML-кода, в Wix — через элемент «Встроить код».
Chrome, Safari, Firefox и Edge блокируют видео, которые сами начинают играть со звуком. Беззвучное автовоспроизведение разрешено, поэтому генератор автоматически добавляет mute=1.
Плеер загружается с youtube-nocookie.com и не сохраняет cookie YouTube у посетителя, пока тот не нажмёт «Воспроизвести». Выглядит и работает так же, а сайту проще соблюдать требования к персональным данным.
Включите «Адаптивно». Код использует width:100% и aspect-ratio:16/9, поэтому плеер заполняет блок на телефоне и компьютере без чёрных полос и дополнительного CSS.
Возможно, автор запретил встраивание, видео приватное, с возрастным ограничением или заблокировано в стране посетителя, либо ссылка неверная. Сначала проверьте код в предпросмотре — если не работает там, не заработает и на сайте.
Да. Заполните поля «Начать с» и «Закончить на». Плеер начнёт с первого времени и остановится на втором — удобно, чтобы показать фрагмент длинного урока или стрима.
Вставьте видео YouTube, которое подстраивается под любой экран: меню «Поделиться», адаптивный код, время начала, режим конфиденциальности, WordPress и скорость.
Как найти 11-символьный ID видео YouTube в ссылках watch, youtu.be, Shorts, embed и live на компьютере или телефоне — и как извлечь много ID сразу.
Поделитесь роликом YouTube, который начнётся с нужной минуты: на компьютере, на телефоне, с параметром ?t= или как кликабельное время в комментариях.