cinema

Добавление видео на сайт в flash проигрывателе

Наилучшим способом размещения собственных видео на сайте являются shared коды с сайтов YouTube, Vimeo, таким образом вы экономите на дисковом пространстве хостинга и видео с вашим продуктом сможет увидеть большее количество зрителей, чем посетители вашего сайта, например, через поиск социальной сети.

Если вы решили хранить все видео локально на сайте, то их необходимо чем то воспроизводить. К сожалению на сегодняшнее время решение, предоставляемые HTML5 не поддерживаются наиболее популярными браузерами, то приходится прибегать к средствам flash.

Исследовав тему, я нашел одно из оптимальных решений, котрое доступно к пониманию любого администратора сайта.

Инструментарий

Скачать программу Screenshot_2

2. Добавить один файл в поток.
«Добавить файлы…» -> Выбрать в Эксплорере.

Screenshot_3

3. Указать исходящее имя файла.
«Исходящее имя…» -> Убрать все галочки, указав только префикс.

Screenshot_4

4. Выбрать плеер, в котором будет проигрываться видео
«Плеер» -> «Тип», «Цвет»

Screenshot_6

5. Конвертировать файл.
Убрать галочку «Показывать HTML после конвертации». Опционально можете указать качество файла на выходе. И нажать на кнопку «Конвертация».

Screenshot_5

6. Загрузить шаблон для добавление на сайт.
Скачать шаблон

7. Подготовить превью картинки известным вам способом.
Например можно сделать скриншот медиа плеером и загрузить в /u-tek.org/www/flash/videos/captionSamples/

8. Загрузить сконвертированный файл в папку /flash/video
Например /u-tek.org/www/flash/videos/

7. Отредактировать файл settings
Шаблон находится в архиве под именем: settings-exampleArtem.xml
7.1. Переименовать в уникальное имя, например: settings-example-abso.xml
7.2. Открыть файл блокнотом и изменить в нём FILE-NAME-ЗАМЕНИТЬ.flv на имя видео файла, например abso.flv. И имя превью картинки FILE-NAME-ЗАМЕНИТЬ.jpg, например absopic.jpg

8. Загрузить settings файл в корен каталога /flash рядом с другими settings
Например: /u-tek.org/www/flash/

Screenshot_8

9. Cформировать код для добавления
9.1. Открыть шаблон файла insert.html в блокноте
9.2. Указать имя settings файла, который создали заменив SETTINGS-FILE-ЗАМЕНИТЬ.xml в моем примере на settings-exampleArtem.xml
9.3. Указать уникальный код для видео заменив в нескольких местах ID-NAME-ЗАМЕНИТЬ на уникальный, например abso123

Screenshot_9

10. Добавить код в форму на сайте, проверив не включен ли wysiwyg.

Screenshot_10

В режиме HTML у вас не будет видна панель редактирования текста и форматирование текста будет отсутствовать.

Screenshot_12

12. Проверить результат результат

Screenshot_11

При последующих новых добавлений файлов, желательно удаляйте свои файлы, и перераскаковывайте архив с шаблонами.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *