- 3
Информация о файле
Модуль решает проблему длительной загрузки iframe из youtube и vimeo и увеличивает page speed. Позволяет добавлять видео youtube и vimeo в полях описаний страниц, добавлять видео шорткордами, собирать видео в галерею на странице товара, отображать видео в popup
Для РФ и РБ модуль не продается и поддержка не предоставляется.
Все вставки iframe с видео на вашем сайте перед выводом на страницу будут автоматически заменены на превью видео в виде изображений, которые подтягиваются с img.youtube.com/vi.
Внимание! Модулю без разницы, каким образом у вас реализован вывод видео (через доп поля, описание товара, доп вкладки или прямо в файле), он собирает конечный код iframe и заменяет на свой именно при рендеринге страницы системой opencart. Т.е весь ваш фунционал остается на месте и видео добавляете на сайт как и раньше. В любой момент модуль можно отключить.
ЗАЧЕМ
Все знают, что iframe с видео очень сильно загружают страницу и уменьшают скорость загрузки сайта. Особенно это ощутимо (и даже визуально видно), если на странице несолько видео (каждый iframe это доп. запросы и ресурсы). Бонус - галерея видео и удобное добавление видео на сайт.
ВОЗМОЖНОСТИ
- поддержка youtube, youtube shorts, vimeo
- удобная вставка видео шорткодами
- видео по клику на превью
- всплывающее окно с видео по кліку на превью
- свое изображение для превью
- выбор размера превью
- настройки иконки 'play' (изображение, font awesome, html) и ее стлизация
- сбор видео в галерею на основе добавленных iframe и шорткодов в описании товара
- выбор позиции галереи и ее стилизация
- иконка видео в категории
- иконка видео в товаре (открытие галереи по клику как опция)
- 2 режима работы галереи
- возможно указать пути для исключения работы модуля
- поля для кастомных стилей и js
ОСОБЕННОСТИ
- будет работать на всех шаблонах и страницах
- максимально легкий модуль без зависимостей (всего пару строк css и ванильного js, никаких библиотек)
- будет работать даже без бутстрапа и jquery
- открытый код
- полная версия 2.0 только для opencart/ocstore 2.2+, для более низких - версия 1
ДЕМО
Адмінка https://oc3.likedev.pro/admin/ логін/пароль: demo/demo
товар https://oc3.likedev.pro/imac
стаття https://oc3.likedev.pro/6-video
ПРИМЕНЕНИЕ
- увеличение скорости загрузки и в результате лучший показатель page speed
- удобное добавление видео на сайт
- кастомизация внешнего вида видео превью
- организация галереи видео в карточке товара без риска для скорости сайта
- вывод видео в popup позволит показывать ваши iframe даже на ограниченном пр
- подмена превью на свои позволит поставить нужные вам изображения для видео и украсить сайт
6 видео - разница 30-50%
Модуль выключен:
https://oc23.likedev.pro/6-video?disable-video-optim
и page speed 49/33 - https://developers.google.com/speed/pagespeed/insights/?hl=uk&url=https%3A%2F%2Foc23.likedev.pro%2F6-video%3Fdisable-video-optim&tab=mobile
Модуль включен
https://oc23.likedev.pro/6-video
и page speed 92/75 - https://developers.google.com/speed/pagespeed/insights/?hl=uk&url=https%3A%2F%2Foc23.likedev.pro%2F6-video
Страница та же, только в первом случае добавлен параметр ?disable-video-optim , чтобы модуль не срабатывал и можно было увидеть разницу.
1 видео - разница 10-30%
И даже с 1 видео показатель достаточно проседает, особенно для мобильных устройств
Модуль выключен:
https://oc23.likedev.pro/1-video?disable-video-optim
и page speed 88/51 - https://developers.google.com/speed/pagespeed/insights/?hl=uk&url=https%3A%2F%2Foc23.likedev.pro%2F1-video%3Fdisable-video-optim&tab=desktop
Модуль вкючен:
https://oc23.likedev.pro/1-video
и page speed 96/80 - https://developers.google.com/speed/pagespeed/insights/?hl=uk&url=https%3A%2F%2Foc23.likedev.pro%2F1-video&tab=mobile
Кроме того визуально намного симпатичнее превью с иконкой, чем ютубовский iframe, да и возможность открытия видео в popup тоже очень полезна. + мы можем через css стили кастомизировать превью как нам угодно.
Чтобы не было черных полос, можно поставить заставки к видео на канале youtube или загрузить свои в папку модуля.
ВАЖНО! Предпочтительно использовать режим POPUP для лучшей совместимости с шаблонами, разметкой и адаптивности видео.
УСТАНОВКА
видео установки
(только тут фикс не нужен, остальное - так же)
Через установщик в админке загружаете архив модуля ocmod для своей версии опенкарт.
Для версий 2.x убедитесь, что у вас уже установлен модификатор localcopy.ocmod, если его нет - установите.
PS. Для редактора CKeditor при вставке в режиме кода некоторых тегов, в т.ч и iframe, редактор их чистит. В таком случае делаем фикс :
в admin\view\javascript\ckeditor\config.js
после строки
config.resize_enabled = false;
прописать
config.allowedContent = true;
ОБНОВЛЕНИЕ к версии 2.0:
1. Удалить модификатор старой версии модуля Youtube lazy load and popup
2. Обновить модификаторы
3. Установить архив новой версии как обычное дополнение через установщик
4. В списке расширений удалить модуль и установить заново
ЛИЦЕНЗИЯ
Лицензия выдается на один домен. Также при необходимости на тестовый поддомен.
Ключ будет выслан автоматически на почту покупателя сразу после вашего заказа. Если по какой-то причине письма нет - пишите на почту или в лс.
Приветствую дельные предложения по развитию и расширению модуля.
ПРОСЬБА УКАЗЫВАТЬ ДОМЕН СРАЗУ ПРИ ПОКУПКЕ
Также смотрите модули:
Accordion & Tabs & Steps, Faq & HowTo Microdata, any place & content
Smart Video Widgets - видео в фоне, баннера, изображения, уведомления с настройкой условий показа
Google Reviews - отзывы с гугл карт (Google Business) с виджетом доверия + отзывы о товарах
Grapes Web Builder - более чем визуальный редактор