Все для DataLife Engine / DLE хаки / Хак для DLE / DLE хак YouTube PopUp jQuery Plugin для вывода видео

DLE хак YouTube PopUp jQuery Plugin для вывода видео

YouTube PopUp jQuery Plugin
DLE хак YouTube PopUp jQuery Plugin для вывода видео с youtube по ссылке на страницу просмотра ролика, установка простая, скрипты и RSS информер в котором применяются ссылки сервиса на ролики. Хак является доработкой плагина, чтобы корректно принять в шаблоне DataLife Engine. Основа данной разработки написана на чистом jаvascript, в ней нет каких-либо дополнительных библиотек. Маленький скрип настраивается легко, поддерживающий все необходимые параметры для работы на современных браузерах, плеер для видео с YouTube и Vimeo. Бесплатно представляем на dle9.com jQuery плагин, чтобы вывести ваше видео с YouTube или Vimeo во всплывающее PopUp окно, он снабжен рядом полезных функций, есть автостарт при открытии PopUp окна и другие возможности.

YouTube PopUp jQuery Plugin для DataLife Engine — предназначен для просмотра видео по ссылке на странице ролика. Доработка плагина для использования в шаблона DLE CMS. Например для RSS информеров в которых используются ссылки на youtube ролики. Исходный плагин, перенесен в структуру папок шаблона DLE.

Крайне интересный и полезный DLE хак globalnyj-teg-inform.xml! Который можно применить сосвметсо с этим скриптом. Предназначит haks, чтобы применить теги RSS информера не только в main.tpl, но в любых файлах вашего шаблона.

Что в комплекте:

папка [DLE-CMS] содержит готовый набор для добавления в свой шаблон.
папка [original] содержит исходную версию модуля.

Улучшения

Добавлен ключ ?rel=0 для запрета отображения чужих роликов в качестве похожих видео.

DLE установка:

Перенести содержимое архива, папки DLE-CMS/tempaltes/{THEME} в ваш шаблон на сайте.

В файле main.tpl найти место подключения jQuery, напоминаю, что он уже есть в любой версии DLE. Обычно он загружается переменной

{jsfiles}{AJAX}


если скрипты вынесены в коней файла.

Или перед закрывающим тегом

</body>


Если используется классический способ подключения стилей и JS.

После jQuery Вставить:

{* YouTube_PopUp *}
<link rel="stylesheet" type="text/css" href="{THEME}/assets/youtubepopup/YouTubePopUp.css">
<script type="text/javascript" src="{THEME}/assets/youtubepopup/YouTubePopUp.jquery.js"></script>
<script type="text/javascript">
  jQuery(function(){
      jQuery("a.bla-1").YouTubePopUp();
      jQuery("a.bla-2").YouTubePopUp( { autoplay: 0 } ); // Disable autoplay
  });
</script>


В шаблоне RSS информера informer.tpl для загрузки роликов по клику на картинку-превью с ютуба использовать код

Где класс bla-1 - открытие модального окна с автоматическим запусков видео,
а класс bla-2 - открытие окна с отключенным автозапуском видео.


Если же необходимо добавить запуск окна с плеером YouTube для всех ссылок на сайте, которые ведут сервис, тогда добавьте

 $('a[href^="https://www.youtube.com/watch?"]').addClass("bla-2");


и получиться что-то вроде

{* YouTube_PopUp *}
<link rel="stylesheet" type="text/css" href="{THEME}/assets/youtubepopup/YouTubePopUp.css">
<script type="text/javascript" src="{THEME}/assets/youtubepopup/YouTubePopUp.jquery.js"></script>
<script type="text/javascript">
	$('a[href^="https://www.youtube.com/watch?"]').addClass("bla-2");
	jQuery(function(){
	  jQuery("a.bla-1").YouTubePopUp();
	  jQuery("a.bla-2").YouTubePopUp( { autoplay: 0 } ); // Disable autoplay
	});
</script>




Автор: tcse

Скачать dle хаки для показа роликов в удобном формате на вашей площадке, как представленный выше хак, доступен у нас по следующей ссылке

hak_youtube_popup-master.zip [155,42 Kb] (cкачиваний: 8)
  • 100
Добавить комментарий

Оставить комментарий

    • bowtiesmilelaughingblushsmileyrelaxedsmirk
      heart_eyeskissing_heartkissing_closed_eyesflushedrelievedsatisfiedgrin
      winkstuck_out_tongue_winking_eyestuck_out_tongue_closed_eyesgrinningkissingstuck_out_tonguesleeping
      worriedfrowninganguishedopen_mouthgrimacingconfusedhushed
      expressionlessunamusedsweat_smilesweatdisappointed_relievedwearypensive
      disappointedconfoundedfearfulcold_sweatperseverecrysob
      joyastonishedscreamtired_faceangryragetriumph
      sleepyyummasksunglassesdizzy_faceimpsmiling_imp
      neutral_faceno_mouthinnocent