Видео YouTube в HTML

Самый простой способ включить видео в HTML - это использовать YouTube.

Сомневаетесь в формате видео?

Преобразование видео в другое формат может быть как сложным, так и занимающим много времени.

Простое решение - позволить YouTube воспроизводить видео на вашей веб-странице.

YouTube Video Id

При сохранении (или воспроизведении) видео YouTube показывает идентификатор (например, ih1l6wb7LhU).

Вы можете использовать этот идентификатор и ссылаться на ваше видео в HTML-коде.

Включите YouTube видео в HTML

Чтобы воспроизвести видео на веб-странице, выполните следующие действия:

  • Загрузите видео на YouTube
  • Запомните идентификатор видео
  • определите в вашем веб-странице <iframe> элемент
  • Сделайте src свойство для указания URL видео
  • Используйте width и height Свойства определяют размер плеера
  • Добавьте другие параметры в URL (смотрите далее)

Пример

<iframe width="420" height="315"
src="https://www.youtube.com/embed/ih1l6wb7LhU">
</iframe>

Попробуйте сами

YouTube Autoplay + Mute

Вы можете сделать видео на YouTube начальным, добавив autoplay=1 в URL. Однако, автоматическое начало воспроизведения видео может раздражать ваших посетителей!

Внимание:В большинстве случаев браузер Chromium не позволяет автоматическое воспроизведение. Но всегда разрешено беззвучное автоматическое воспроизведение.

В autoplay=1 Добавить после mute=1Автоматически начнет воспроизведение вашего видео (но будет без звука).

YouTube - Автоматическое воспроизведение + Без звука

<iframe width="420" height="315"
src="https://www.youtube.com/embed/ih1l6wb7LhU?autoplay=1&mute=1">
</iframe>

Попробуйте сами

YouTube Плейлист

Список видео для воспроизведения, разделенный запятыми (исключая исходный URL).

YouTube Цикл

Добавить loop=1 Сделает ваше видео повторяться вечно.

Значение 0 (по умолчанию): видео будет воспроизводиться один раз.

Значение 1: видео будет повторяться (вечно).

YouTube - Цикл

<iframe width="420" height="315"
src="https://www.youtube.com/embed/ih1l6wb7LhU?playlist=ih1l6wb7LhU&loop=1">
</iframe>

Попробуйте сами

YouTube Управление

Добавить controls=0 Сделает видео плеер без видимых элементов управления.

Значение 0: элементы управления плеером не видны.

Значение 1 (по умолчанию): видны элементы управления плеером.

YouTube - Управление

<iframe width="420" height="315"
src="https://www.youtube.com/embed/ih1l6wb7LhU?controls=0">
</iframe>

Попробуйте сами