Как вывести видео через fancybox или litebox с превью youtube изображением ?
Через litebox никак.
Можно вынести через fancybox
вот ссылка http://fancyapps.com/fancybox/3/. Скачиваем , заходим в папку \dist , берем минимизированные Js и css файл. Дописываем в header нужной страницы. Этот код для bitrix.
Вот изначальный код из документации
|
1 2 3 4 |
<a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk"> YouTube video <img src="paths"> </a> |
Если нужно превью , то воспользуемся функцией php.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
function getYoutubeVideoID($url){ // допустимые доменые имена в ссылке $names = array('www.youtube.com','youtube.com'); // разбор адреса $up = parse_url($url); // проверка параметров if (isset($up['host']) && in_array($up['host'],$names) && isset($up['query']) && strpos($up['query'],'v=') !== false){ // достаем параметр ID $lp = explode('v=',$url); // отсекаем лишние параметры $rp = explode('&',$lp[1]); // возвращаем строку, либо false return (!empty ($rp[0]) ? $rp[0] : false); } return false; } // массив ссылок ютуба $mass_video_url=array( 'https://www.youtube.com/watch?v=_sI_Ps7JSEk', 'https://www.youtube.com/watch?v=_sI_Ps7JSEk', 'https://www.youtube.com/watch?v=_sI_Ps7JSEk', ); // массив в который соберем src изображений с ютуба $mass_video_foto=array(); foreach ($mass_video_url as $key=>$url){ $src='http://img.youtube.com/vi/'.getYoutubeVideoID($url).'/0.jpg'; //собираем в массив. $mass_video_foto[]=$src; // или сразу выводим echo '<a data-fancybox href="'.$mass_video_url[$key].'" ><img style="width:100px; margin-right:10px;" src="'.$src.'"></a>'; } |
