VideoPlayer
Актуально для версии 2.9.6
Задача: Выводить на страницах сайта видеоплеер для проигрывания файлов в формате flv
Реализация:
Нам нужно добавить плеер для воспроизведения flv роликов на нашем сайте. Эти ролики должны воспроизводиться не сразу после загрузки страницы, а лишь по нажатию кнопки "Play".
Для начала нужно определиться с выбором плеера. В сети их большое количество. Как говорится: выбирай на вкус!
Рассмотрим вывод видеоплеера Flowplayer.
Итак, скачиваем с сайта производителя дистрибутив.[1] (Если ссылка не работает, то отсюда [2] ) Разархивриуем.
В директорию ./js на сервере поместим файл flowplayer-3.1.4.min.js из скаченного архива.
Для подключения видеоролика нам потребуется вставить в код шаблона пару строк:
<head>
<!--
добавляем код на JavaScript который помогает работать с флэш и Flowplayer API для настройки функционала плеера.
и нам необходимо разместить файл скрипта в папку js -->
<script type="text/javascript" src="/js/flowplayer-3.1.4.min.js"></script>
</head>
Создадим директорию ./player на сервере и поместим в нее два файла: flowplayer-3.1.5.swf и flowplayer.controls-3.1.5.swf из скаченного архива. А теперь размещаем код плеера в тэге <body> в нужном нам месте:
<!-- этот тэг <A> с настройками видеоролика размещаем в нужном месте -->
<a
href="http://188.226.173.237/barsandtone.flv"
style="display:block;width:520px;height:330px"
id="player">
</a>
<!-- этот код позволяет утановить flowplayer внутри предыдущего тэга <A>. -->
<script>
flowplayer("player", "/player/flowplayer-3.1.5.swf");
</script>
То, что мы пока сделали - статически добавили код в tpl шаблон. А нам хочется, чтобы пользователь сам мог добавлять в административной панели нужный видеоролик и параметры его воспроизведения.
В этом случае в модуле "Шаблоны данных" создадим поле для добавления файла (поле типа "Файл") и поля для задания параметров видеоплеера: ширина и высота (тип "Число"). Короткие макросы вывода значений этих полей можно вставить в шаблон страниц, у которых эти поля присутствуют:
<a
href="%src_file_flv%"
style="display:block;width:%width%px;height:%height%px"
id="player">
</a>
В этом коде %src_file_flv% - идентификатор поля типа "Файл", в которое в административной панели указывается файл видеоролика. Если Вы указали в настройках поля в модуле Шаблоны данных другой идентификатор, то Вам нужно изменить в коде идентификатор на Ваш.
