Добавление видеоролика в электронный учебник

Стандартные средства добавления видео в программе TuboSite устарели. Для добавления видеоролика рекомендуется использовать HTML5-тег <video>.

Использование <video>#

С помощью тега <video> можно встроить любой видеоролик. Но следует понимать, что некоторые браузеры не поддерживают определённые форматы.

Рекомендуется использовать формат MP4 с кодеком H.264 (AVC). 

Примечание

Более современный кодек H.265 (HEVC), требует больше ресурсов браузера. Видео может не воспроизводиться или не поддерживать звук

В папку user-video скопируйте ваш видеоролик (video.mp4). 

На вкладке HTML-код, нужно найти закрывающий тег абзаца </p>, после которого вы хотите встроить видеоролик. И после него вставить следующий код:

<video controls>
	<source src="user-video/video.mp4" type="video/mp4">
	<source src="user-video/video.ogv" type="video/ogg">
</video>

Обратите внимание, внутри тега <video> находятся несколько тегов <source>. Так мы указываем браузеру, что если видео не поддерживается в формате MP4, его следует открывать в формате OGV.

На практике всегда достаточно одного формата MP4, поэтому можно использовать такой вариант кода:

<video controls>
	<source src="user-video/video.mp4" type="video/mp4">
</video>
Встраивание видео на страницу учебника
Рис 1. Встраивание видео на страницу учебника

Атрибуты <video>

Атрибут Описание
controls включает панель управления воспроизведением видео
autoplay автоматическое воспроизведение видео, после загрузки страницы
width ширина видеоплеера
muted отключаем звук видеоплеера
loop циклическое воспроизведение ролика
poster путь к заставке (изображение) видеоролика

Атрибуты <source>

Атрибут Описание
type определяет MIME-тип видеофайла
src указывает путь к видеофайлу, относительно папки public_html
Совет

По аналогии с изображениями, видеоролики лучше переименовать в зависимости от номера главы и порядка на странице. Например, 1-1.mp4

Инструмент Видео#

Этот способ встраивания видео устарел, а также требует наличие библиотеки для воспроизведения видеофайлов (подключена в стандартных шаблонах).

Для встраивания видеоролика, нужно поставить курсор в тексте. И выбрать инструмент Видео. Добавить ролик в формате .mp4. И встроить его по аналогии с картинками Вставить в страницу.