Хаки и Скрипты Next Generation CMS : Разное, Онлайн сервисы : Плеер YouTube на сайте с плейлистом

irbees2008 Опубликовано - 29 - сентября Разное

Адаптировал: irbees2008
Уровень сложности исполнения: нужны навыки css html

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

Итак приступим
Идём на сайт jwplayer.com, регистрируемся, и заходим в личный кабинет.

Находим Players жмём и переходим

Жмем кнопку CREATE A PLAYER

Настраиваем плеер как нам нужно и сохраняем

И получаем ссылку на скрипт который на нужен

Вот моя ссылка на скрипт
https://cdn.jwplayer.com/libraries/L01LAQIH.js

Ну с сервисом на этом все.Дальше подключение плеера.
В секцию <head> подключаем скрипт и стиили;

Код:

<script src="https://cdn.jwplayer.com/libraries/L01LAQIH.js"></script>
<style>
#player_jwplayer_playlistcomponent .jwlist li.active .jwtitle {
color: #0F0 !important;
}
#player_logo{width:1px;height:1px;}
#player_jwplayer_playlistcomponent .jwlist li {
    height: 16px !important;
}
li div.jwplaylistimg.jwfill{
width:1px !important;height:1px !important;
}
#player_jwplayer_playlistcomponent .jwtitle {
margin-top: 0px !important;
}
</style>

Там где надо выводить плеер добавляем :

Код:

<!-- player youtube -->
<div id="player"></div>
<script type="text/javascript">
jwplayer("player").setup({
playlist: "http://Ваш_сайт.рф/папка_плейлиста/play.xml",
width: 1040,
height: 440,
listbar: {
position: 'right',
size: 360 
}
});
</script>
<!-- player youtube end -->

В скрипте http://Ваш_сайт.рф/папка_плейлиста/play.xml заменить на свой путь до плейлиста.

Теперь сам плейлист, в моём примере это play.xml, и вот его содержимое.

Код:

<rss version="2.0" xmlns:media="http://search.yahoo.com/mrss/">
<channel>
<item>
<title>Верстка макета из PSD От профи</title>
<media:content url="https://www.youtube.com/watch?v=uS99nER1PwY" />
</item>
<item>
<title>Учим CSS за 1 час!</title>
<media:content url="https://www.youtube.com/watch?v=Kz50zP-J70Q" />
</item>
<item>
<title>Учим HTML за 1 Час!</title>
<media:content url="https://www.youtube.com/watch?v=5pBcKKiZSGE" />
</item>
</channel>
</rss>

url это адрес клипа на youtube.com

Вот пример:

А вот теперь и сама плюшка,будем ускорять создание плейлиста.
Создаём php файл (playlist-maker.php) в корне сайта с вот таким содержимым

Код:

<!DOCTYPE html>
<html>
<head>
<title>playlist</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<p>playlist</p>
<?php
if(isset($_REQUEST['title']))$title=$_REQUEST['title'];
if(isset($_REQUEST['youtube']))$youtube=$_REQUEST['youtube'];
$title=preg_replace("' - YouTube'si","",$title);
$title=preg_replace("'► 'si","",$title);
print '
title=' .$title .'

';
print '
youtube=' .$youtube .'
';
$rez='<item>
<title>' .$title .'</title>
<media:content url="http://www.youtube.com/watch?v=' .$youtube .'" />
</item>
';
file_put_contents('playlist.php', $rez, FILE_APPEND | LOCK_EX);
$xml = file_get_contents('playlist.php');
$top = '<rss version="2.0" xmlns:media="http://search.yahoo.com/mrss/">
<channel>
';
$bot = '</channel>
</rss>';
$xml = $top .$xml .$bot;
file_put_contents('playlist.xml', $xml);
?>
</body>
</html>

Далее в браузере создаёте закладку и в поле "Адрес" добавляете:

Код:

javascript:window.location='http://Ваш_сайт.рф/playlist-maker.php?title='+document.title+'&youtube='+window.location.search.replace("?v=","");

в которой
http://Ваш_сайт.рф/playlist-maker.php это адрес файла playlist-maker.php который мы создали, ну или перетащите вот эту кнопку Добавление в плейлист в панель закладок и потом отредактируйте в ней адрес на на файл http://Ваш_сайт.рф/playlist-maker.php

Ну теперь идём на сайт www.youtube.com, находим там нужный
клип и нажимаете на на созданную закладку в панели закладок.

Мы переходим на http://Ваш_сайт.рф/playlist-maker.php, и при этом
в файл плейлиста playlist.xml добавится выбранный клип.
Ворачиваемся обратно на youtube.com , находим там следующий клип
и снова нажимаем на ссылку в панели закладок и т.д. Файл плейлиста сохранится по адресу http://Ваш_сайт.рф/playlist.xml

Вот пример собранного плейлиста :

Вот вроде и все.

Можешь почитать и вот эту статейку "Как увидеть пароль, скрытый звёздочками?"

Это тоже интересно

Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.