[Поддержка] YTPlayer | Видео Фон/Карусель/Презентация

[Nymphetamine 55]

750
Скачать/Купить дополнение

YTPlayer | Видео Фон/Карусель/Презентация

---

Особенности:

• Возможность привязывать видео фон к любому элементу на странице (body или произвольный id/class) или показывать внутри текущего блока (self).
• Возможность разбивать видео на карусели.
• Указывать продолжительность видео (от и до).
• Указывать положение видео при resize.
• Выбирать качество видео.
• Регулировать громкость.
• Загружать резервное изображение на случай, когда видео откл. на моб. устройствах.
• Накладывать изображение маски поверх видео.
• Привязывать контейнер и указывать цвет фона с использованием прозрачности (rgba).
• Создавать фильтры:
  • Градации серого.
  • Сепия.
  • Яркость.
  • Контраст.
  • Насыщенность.
  • Прозрачность.
  • Размытие.
  • Инвертация.
  • Поворот оттенка.

 

Отображение (опционально):

• Автовоспроизведение.
• Остановка видео при потере фокуса окна.
• Остановка видео в невидимости.
• Запоминание видео.
• Подгонять под размеры экрана.
• Отображение видео в моб. устройствах.
• Накладывать узор поверх видео.
• Повторять видео.
• Заголовок.
• Описание.
• Навигация карусели.
• Пагинация карусели.
• Навигация YouTube.
• Кнопка на весь экран.
• Ссылка на источник YouTube.

 

При помощи данного модуля легко можно реализовать:

• Видео фон.
• Видео карусель.
• Презентацию.
• И многое другое..

 

* Весь функционал настраиваться из админ. панели.

* Не требует vqmod/ocmod.

* Простой в установке.

* Поддержка всех версий ocStore/OpenCart.

 

Демо:

• Демо #1 - отображен основной функционал + подменен фон на видео для меню и подвала.
• Демо #2 - пример видео фона на весь экран.
• Админка - логин и пароль: demo

---

• Добавил
  Nymphetamine
• Добавлено
  20.08.2018
• Категория
  Модули
• Системные требования
• Метод активации
  Автоматическая активация
• Ioncube Loader
  Нет
• OpenCart
  3.0
  2.3
  2.2
  2.1
  2.0
  1.5.6.4
  1.5.6.3
  1.5.6.2
  1.5.6.1
  1.5.6
  1.5.5.1
  1.5.5
  1.5.4.1
  1.5.3.1
• ocStore
  3.0
  2.3.0.2.4
  2.3
  2.2
  2.1
  1.5.5.1.2
  1.5.5.1.1
  1.5.5.1
  1.5.4.1.2
  1.5.4.1.1
  1.5.4.1
  1.5.3.1
  1.5.2.1
  1.5.1.3
• OpenCart.Pro, ocShop
  Opencart.pro 2.3
  Opencart.pro 2.1
  OcShop 2.0.3.х
  OcShop 1.5.6.4.х
• Обращение к серверу разработчика
  Да

 

[specialforce22 235]

Здравствуйте!

А видео фон адаптируется под отображение на телефоне?

[Nymphetamine 55]

В 24.08.2018 в 19:00, specialforce22 сказал:

Здравствуйте!

А видео фон адаптируется под отображение на телефоне?

Здравствуйте.

Да, принцип работы, как на пк, но на моб. устройствах нюанс в другом. Некоторые девайсы могут воспроизвести видео через встроенное приложение, а не фрейм., из-за чего вы можете увидеть видео фон не во фрейме, а встроенном приложение   Вы можете откл. видео на моб. устойства во вкладке "Отображение" -- "Показывать видео в моб. устройствах". При использование данной функции будет подмена на изображение из вкладки "Дополнительно -- Изображение".

[Nymphetamine 55]

Приложил скрины, как выглядит на моб. устройствах (без встроенного плеера):

 

[specialforce22 235]

7 часов назад, Nymphetamine сказал:

Здравствуйте.

Да, принцип работы, как на пк, но на моб. устройствах нюанс в другом. Некоторые девайсы могут воспроизвести видео через встроенное приложение, а не фрейм., из-за чего вы можете увидеть видео фон не во фрейме, а встроенном приложение   Вы можете откл. видео на моб. устойства во вкладке "Отображение" -- "Показывать видео в моб. устройствах". При использование данной функции будет подмена на изображение из вкладки "Дополнительно -- Изображение".

 

О! ну это супер..Надеюсь, что смогу разобраться, как подключать фон и тд.

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

И не всегда стопкадр видео на телефоне был удачен)) как на новогодней елке Победы, где название мероприятия и даты никак не хотели попадать в кадр))

 

Поэтому фото-заглушка для мобильны - супер решение.

 

Скажите, а в самой карточке, в рамках описательного текста возможно сделать вывод карусели видосов.

Или это делать через схемы?

Просто на форуме есть решение для вывода галлереи, но для саммернот, а я использую скэдитор

 

[Nymphetamine 55]

В 26.08.2018 в 08:39, specialforce22 сказал:

Скажите, а в самой карточке, в рамках описательного текста возможно сделать вывод карусели видосов.

Или это делать через схемы? 

Просто на форуме есть решение для вывода галлереи, но для саммернот, а я использую скэдитор 

Вначале создаете карусель, после привязывайте модуль к схеме.

 

В 26.08.2018 в 08:39, specialforce22 сказал:

Просто на форуме есть решение для вывода галлереи, но для саммернот, а я использую скэдитор 

Не совсем понял о какой галереи идет речь? Вы хотите расширить summernote?

[specialforce22 235]

43 минуты назад, Nymphetamine сказал:

Вначале создаете карусель, после привязывайте модуль к схеме.

 

Не совсем понял о какой галереи идет речь? Вы хотите расширить summernote?

 

С каруселью и привязкой чрз схему разобрался здорово работает)

+ подскажите, плз, не совсем разбираюсь в классах, какой нужно нужно класс прописывать для модуля html, я так понял там надо указать класс и id этого модуля, чтобы сделать фоновое видео только в рамках блок этого модуля.

 

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

Это, наверно, надо тоже создавать какой-то блок-класс, чтобы выводить не через схему, а в само описание карточки?

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

 

 

[Nymphetamine 55]

1 час назад, specialforce22 сказал:

+ подскажите, плз, не совсем разбираюсь в классах, какой нужно нужно класс прописывать для модуля html, я так понял там надо указать класс и id этого модуля, чтобы сделать фоновое видео только в рамках блок этого модуля.

Самое простое в html-блоке, обернуть описание в div, например:

<div class="my-class"> ... </div>

 

Затем в настройках ytplayer указать данный класс:

 

Еще как вариант в html-блок выводить произвольное поле "Css-class".

 

1 час назад, specialforce22 сказал:

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

Это, наверно, надо тоже создавать какой-то блок-класс, чтобы выводить не через схему, а в само описание карточки?

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

 

Скорее всего в вашем примере вывод видео реализован через визуальный редактор.

Если вам нужно вывести видео, которое не привязано к текущему товару, тогда достаточно указать id/class блока, но если нужно уникальное для каждого товара, так это все усложняет. Доработать можно под вас, но нужно понимать, что вы хотите получить.

Вы можете заказать доп. услугу (за подробностями обращайтесь в личные сообщения):

 

[specialforce22 235]

Честно скажем, я в шоке - СУПЕР!

 

Настройки для обычного юзверя даже без поллитру понятны))) как 2Х2

Обнаружил, что еще можно и писать на видюхе.

Вот за 15 минут организуется не плохое промо на главную - Баскет Холл

 

Думаю так хороводом по всей главной наделать промо роликов.

 

Токмо один вопрос, что посоветуете сделать с текстом? в мобильную версию он не помещается.

Резонно оставлять только одну кнопку.

 

Возможен ли от Вас мастерский урок для методиста по научному тыку, как написать правильно, чтобы текст на видео в мобиле скрывался, а оставалось кнопка?

 

Спасибо!)

 

[Nymphetamine 55]

@specialforce22

Спасибо.

 

51 минуту назад, specialforce22 сказал:

Токмо один вопрос, что посоветуете сделать с текстом? в мобильную версию он не помещается.

Резонно оставлять только одну кнопку. 

Можете скрыть описание, например:

@media (max-width: 991px) {
     .ytplayer-item .description {
          display: none !important;
     }
} 

Или задать размер шрифта, высоту:

@media (max-width: 991px) {
     .ytplayer-item .description div,
     .ytplayer-item .description span, {
          height: auto !important;
     }
     .ytplayer-item .description p {
          font-size: inherit !important;
     }
} 

Подобное лучше задавать через css, без использования визуального редактора, таким образом вы сможете получить код без лишнего мусора. Вы можете задавать свой набор стилей для необходимого расширения (используйте @media) и указывайте единицу измерения em, vh. %, px,  но это уже тема по html/css, и никакого отношения к модулю не имеет  

[specialforce22 235]

11 минут назад, Nymphetamine сказал:

но это уже тема по html/css, и никакого отношения к модулю не имеет  

 

Да, конечно, стараюсь не обуревать)) итак много подсказываете - спасибо!

 

Тогда вот мой козырный туз по хотелкам на будущие релизы модуля)) - как мне кажется логично заголовок видео сделать ссылаемым.

Получается человек смотрит листая видюхи, а они же, как правило, презентации товара, хоп - заинтересовался, а, как показывает практика, народ тычет в заголовки))

 

Или это уже предусмотрено и я не вижу?

 

Спс..

[Nymphetamine 55]

5 минут назад, specialforce22 сказал:

 

Да, конечно, стараюсь не обуревать)) итак много подсказываете - спасибо!

 

Тогда вот мой козырный туз по хотелкам на будущие релизы модуля)) - как мне кажется логично заголовок видео сделать ссылаемым.

Получается человек смотрит листая видюхи, а они же, как правило, презентации товара, хоп - заинтересовался, а, как показывает практика, народ тычет в заголовки))

 

Или это уже предусмотрено и я не вижу?

 

Спс..

 

Для этих целей вывел описание с поддержкой визуального редактора. Можете откл. заголовок и в описание вставить свои теги, ссылки, и т.п.

[specialforce22 235]

Такой момент.

Вот https://baskethallbilety.ru/

На ПК автовоспроизведение видео - ок, потому что 1 видео на экране.

На мобильном не комильфо.

 

Отключаю в настройках у всех видео автовоспроизведение.

 

Смотрю с мобилы - хорошо - молчат и у каждого видео кнопка.

Но когда нажимаю кнопу верхнего видео, то все вниз стоящие модули тоже активируется и начинается хоровое пение)))

 

Возможно ли локализовать включение каждого модуля?

 

Спасибо!

[Nymphetamine 55]

В 29.08.2018 в 13:13, specialforce22 сказал:

Такой момент.

Вот https://baskethallbilety.ru/

На ПК автовоспроизведение видео - ок, потому что 1 видео на экране.

На мобильном не комильфо.

 

Отключаю в настройках у всех видео автовоспроизведение.

 

Смотрю с мобилы - хорошо - молчат и у каждого видео кнопка.

Но когда нажимаю кнопу верхнего видео, то все вниз стоящие модули тоже активируется и начинается хоровое пение))) 

 

Возможно ли локализовать включение каждого модуля? 

 

Спасибо! 

Поправил автовоспроизведение. Обновите модуль.

Если у вас несколько видео помещаются в текущую область, тогда им ничего не мешает работать одновременно. Проблема будет не только в звуке, но и воспроизведение.

[kilohel 0]

подскажите как видео подогнать по нужным размерам по сайту ?

[specialforce22 235]

В 29.08.2018 в 11:38, Nymphetamine сказал:

 

 

Вопрос связан с подгрузкой модуля и видео на сайт.

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

Есть инструменты ускорения появления модуля и начала видео?

 

Пример

Edited April 19, 2019 by specialforce22

[Nymphetamine 55]

В 19.04.2019 в 11:33, specialforce22 сказал:

 

Вопрос связан с подгрузкой модуля и видео на сайт.

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

Есть инструменты ускорения появления модуля и начала видео?

 

Пример

Видео подгружается удаленно из youtube, и на это нужно больше времени.

Инструментов нет, т.к. это видео передают по iframe.

[uee 0]

Подскажите будет работать с темой Journal 2?

[Nymphetamine 55]

15 часов назад, uee сказал:

Подскажите будет работать с темой Journal 2?

Не проверялось.

[uee 0]

Здраствуйте, Будет показывать видео с Google Диск ?

[Nymphetamine 55]

В 19.09.2019 в 14:07, uee сказал:

Здраствуйте, Будет показывать видео с Google Диск ?

Здравствуйте, только youtube.

[Donni 42]

Из-за видео сайт будет медленнее грузится?

[aleksss454 7]

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

[Nymphetamine 55]

Ничего не тормозит (смотрите демо). Все данные передаются через iframe.

[ulmaksit 14]

Здравствуйте, osstore 2.3.0.2.3 шаблон UNISHOP

 не работает видео в режиме карусели, хотя вроде бы все настройки как у вас в демо сделал.

Подскажите где копать ?