Перейти к содержанию
Nymphetamine

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

Рекомендуемые сообщения

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


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


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

 

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

 

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

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

 

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

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

 

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

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

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

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

 

Демо ocStore 3x:

  • Демо #1 - замена фона в меню/подвале на видео фон, создание карусели, одиночное видео с использованием фильтров, маски, стандартной навигации YouTube.•  
  • Демо #2 - пример видео фона на весь экран
  • Админка - логин и пароль: demo

 

Демо ocStore 2x:

  • Демо #1 - замена фона в меню/подвале на видео фон, создание карусели, одиночное видео с использованием фильтров, маски, стандартной навигации YouTube.•  
  • Демо #2 - пример видео фона на весь экран
  • Админка - логин и пароль: demo

 

Демо ocStore 1.5x:

  • Демо #1 - замена фона в меню/подвале на видео фон, создание карусели, одиночное видео с использованием фильтров, маски, стандартной навигации YouTube.•  
  • Демо #2 - пример видео фона на весь экран
  • Админка - логин и пароль: demo

 

Живые примеры сайтов работающие с данным модулем:


  • Добавил
  • Добавлено
    20.08.2018
  • Категория
  • Системные требования
  • Сайт разработчика
  • Старая цена
    650
  • Метод активации
    Автоматическая активация
  • 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
    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
    Не проверялось

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
В 24.08.2018 в 19:00, specialforce22 сказал:

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

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

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

 

01.jpg

02.jpg

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
7 часов назад, Nymphetamine сказал:

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

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

 

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

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

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

 

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

 

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

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

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

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
В 26.08.2018 в 08:39, specialforce22 сказал:

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

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

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

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

 

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

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
43 минуты назад, Nymphetamine сказал:

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

 

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

 

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

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

 

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

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

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

 

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
1 час назад, specialforce22 сказал:

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

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

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

2018-08-27_17-19-31.thumb.png.43778d88b43e6112b6de3e79bd21a03e.png

 

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

2018-08-27_17-27-05.thumb.png.60c2a6da792cd3538c4880ff73496852.png

 

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

 

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

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

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

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

 

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

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

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

 

  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

 

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

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

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

 

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

 

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

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

 

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

 

Спасибо!)

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

@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, и никакого отношения к модулю не имеет :) 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
11 минут назад, Nymphetamine сказал:

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

 

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

 

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

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

 

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

 

Спс..

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
5 минут назад, specialforce22 сказал:

 

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

 

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

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

 

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

 

Спс..

 

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

Вот https://baskethallbilety.ru/

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

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

 

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

 

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

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

 

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

 

Спасибо!

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
В 29.08.2018 в 13:13, specialforce22 сказал:

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

Вот https://baskethallbilety.ru/

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

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

 

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

 

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

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

 

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

 

Спасибо! 

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

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

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

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

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

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.