Бесплатный плеер для сайта JW Player: облачное подключение

С недавних пор сервис JW Player предоставил бесплатное облачное подключение своего плеера для сайта, иными словами, нам не нужно устанавливать никакие коды и подключать Java-скрипты. Кроме того, установить "облачный" плеер для сайта не так уж и трудно.

Плеер позволяет воспроизводить на страничке сайта видео, загруженное на сервер, жёсткий диск компьютера или с YouTube.

Скин в бесплатном варианте предоставляется только один, но он довольно-таки симпатичный и функциональный, а бар с элементами управления чётко появляется при наведении мышки на видео и так же быстро исчезает при уводе курсора.

Собственно, вот видео, которое я воспроизвёл на сайте с помощью этого плеера:

Loading the player...


Для начала заходим на главную страничку сайта http://www.jwplayer.com и жмём по большой красной кнопке "GET STARTED FOR FREE", расположенной в правом верхнем углу. Вводим свой е-майл в поле ввода и, при желании, снимаем галку у "Please keep me informed of news, offers & updates" (новости я сам узнаю, когда мне это надо). Далее жмём кнопку GET STARTED.
Далее открывается окно с текстом, что на Ваш е-майл отправлено письмо.

В полученном письме жмём кнопку ACTIVATE NOW, что перекидывает нас на страничку придумывания собственного пароля. Пишем свой пароль, подтверждаем и жмём кнопку GET YOUR JW PLAYER и попадаем на страничку менеджера аккаунта/плеера.

Внизу страницы задан вопрос, каким плееров вы хотите пользоваться - установленным на сайте, предлагается его скачать (ссылка Download Self-Hosted Player), либо облачным. Сейчас речь идёт об облачном, поэтому скопируем и сохраним его код (клик по Copy the Cloud-Hosted Code):

1

Этот код надо вставить между тегами <head> и </head>, у меня это:

1
<script src="http://jwpsrv.com/library/w5muJHmtEeOXfCIACi0I_Q.js"></script>

Далее жму большую красную кнопку PUBLISH A VIDEO NOW и попадаю на страницу выбора видео, где я могу использовать видео с сайта, компьютера или YouTube. В нашем случае интересует видео, загруженное на нашем сайте. Поэтому я оставляю всё как есть и ввожу в поле ввода Media File полный путь расположения видеофайла на своём сайте, к примеру, http://MySite.ru/files/video/videoclip.mp4. Таким же образом в поле ввода Poster Image я ввожу полный адрес картинки-заставки, а в поле Media Title название своего клипа, можно кириллицей:

2

И жму кнопку PUBLISH VIDEO.

На следующей странице мне предлагается подобрать размер для видео, т.к. размер у моего клипа нестандартный (400 на 240), я ставлю галку в чекбокс Fixed Dimensions и ввожу свои размеры:

3

Остальные настройки менять не стоит, а скин в бесплатном варианте только один.

Жмём кнопку GET EMBED CODE и получаем код:

4

Код вверху страницы уже был получен ранее, как я писал, его надо вставить между тегами <head> и </head>:

1
<script src="http://jwpsrv.com/library/w5muJHmtEeOXfCIACi0I_Q.js"></script>

А вторую часть кода вставляем между тегами <body> и </body> в том месте, где Вы хотите разместить видео:

1
2
3
4
5
6
7
8
9
10
11
12
<div id='playernLYwDnwqQSuR'></div>
<script type='text/javascript'>
    jwplayer('playernLYwDnwqQSuR').setup({
        file: 'http://MySite.ru/files/video/videoclip.mp4',
        image: 'http://MySite.ru/files/image/image.img',
        title: 'Психованные кролики',
        width: '400',
        height: '240',
        fallback: 'false',
        primary: 'flash'
    });
</script>

Помощь сайту

Понравился сайт? Уроки оказались полезными? Вы можете поддержать проект, просто если скачаете и установите приложение "Фонарик" для Андроид. Приложение написал автор сайта и рассчитывает в дальнейшем публиковать свои приложения. Фонарик управляет светодиодом вспышки фотокамеры телефона, а также включает подсветку экраном на полной яркости.

Преимущества: гибкие настройки. Вы можете задать в настройках, чтобы фонарик сразу включался при запуске приложения и автоматическое включение таймера при запуске приложения. Настройки позволяют отключить блокировку экрана и блокировку фонарика кнопкой включения телефона. Также вы можете самостоятельно установить время таймера.

Если приложение наберёт популярность, это даст стимул автору на создание новых приложений с учётом пожеланий посетителей сайта.

Установить с Google Play.

Заранее благодарен, Дмитрий.

QR-код для установки:

Если Вам понравился материал, скажите свое "спасибо", поделитесь ссылками с друзьями в социальных сетях! Спасибо!

Похожие материалы:

Снимаете свое или монтируете чужое видео для Youtube? Яркая и информативная обложка для ролика - дело нескольких минут. Вам понадобятся: Photoshop...
Программа ЛовиВидео предназначена для скачивания видео и музыки с интернета, в частности, с сайтов Вконтакте (vk.com), Smotri.com, медиафайлов с...
VLC media player
В данной публикации Вы сможете скачать бесплатный проигрыватель VLC media player, также узнать, как переключить интерфейс программы на русский язык и...
четыре вещи, которые следует знать о создание видео в Photoshop
Большинство фотографов, с которыми я общался и которые снимали видео фотокамерами типа DSLR, говорили мне, что у них есть отдельный пакет для работы...