-
2
Опис файлу
Модуль решает проблему долгой загрузки iframe с youtube и увеличивает page speed. Улучшает визуальную часть и дает возможность катомизации: отображение видео в popup, установка своих превью на видео, установка произвольной иконки "play",
Для РФ и РБ модуль не продается и поддержка не предоставляется.
Все вставки iframe с видео на вашем сайте перед выводом на страницу будут автоматически заменены на превью видео в виде изображений, которые подтягиваются с img.youtube.com/vi.
Внимание! Модулю без разницы, каким образом у вас реализован вывод видео (через доп поля, описание товара, доп вкладки или прямо в файле), он собирает конечный код iframe и заменяет на свой именно при рендеринге страницы системой opencart. Т.е весь ваш фунционал остается на месте и видео добавляете на сайт как и раньше. В любой момент модуль можно отключить.
ЗАЧЕМ
Все знают, что iframe с видео очень сильно загружают страницу и уменьшают скорость загрузки сайта. Особенно это ощутимо (и даже визуально видно), если на странице несолько видео (каждый 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
Админка https://oc23.likedev.pro/admin/ логин/пароль: demo/demo
Кроме того визуально намного симпатичнее превью с иконкой, чем ютубовский iframe, да и возможность открытия видео в popup тоже очень полезна. + мы можем через css стили кастомизировать превью как нам угодно.
ВОЗМОЖНОСТИ
- видео по клику на превью
- всплывающеее окно с видео по клику на превью
- произвольные изображение для превью
- выбор размера превью
- установка своей иконки на кнопку 'play' (font awesome, html) и ее стилизация через css
- возможно указать пути для исключения работы модуля
- поля для камтомных стилей и js
ОСОБЕННОСТИ
- будет работать на всех шаблонах
- максимально легкий модуль без зависимостей (всего пару строк css и ванильного js, никаких библиотек)
- будет работать даже без бутстрапа и jquery
- открытый код
ПРИМЕНЕНИЕ
- увеличение скорости загрузки и в результате лучший показатель page speed
- кастомизация внешнего вида видео превью
- вывод видео в popup позволить показывать ваши iframe даже на ограниченном пространстве
- подмена превью на свои позволит поставить подходящие вам изображения для видео и украсить сайт
Если у вас уже есть оптимизация видео от шаблона или каким то модулем - этот модуль вам не нужен или нужен не на всех страницах
Если у вас какие-то нестандартные коды iframe - модуль может работать некорректно и нужна адаптация.
Чтобы не было черных полос, можно поставить заставки к видео на канале youtube или загрузить свои в папку модуля.
ВАЖНО! Предпочтительно использовать режим POPUP для лучшей совместимости с шаблонами, разметкой и адаптивности видео.
УСТАНОВКА
видео установки
(только тут фикс не нужен, остальное - так же)
Через установщик в админке загружаете архив модуля ocmod для своей версии опенкарт.
Для версий 2.x убедитесь, что у вас уже установлен модификатор localcopy.ocmod, если его нет - установите.
PS. Для редактора CKeditor при вставке в режиме кода некоторых тегов, в т.ч и iframe, редактор их чистит. В таком случае делаем фикс :
в admin\view\javascript\ckeditor\config.js
после строки
config.resize_enabled = false;
прописать
config.allowedContent = true;
ЛИЦЕНЗИЯ
Лицензия выдается на один домен. Также при необходимости на тестовый поддомен.
Ключ будет выслан автоматически на почту покупателя сразу после вашего заказа. Если по какой-то причине письма нет - пишите на почту или в лс.
Приветствую дельные предложения по развитию и расширению модуля.
ПРОСЬБА УКАЗЫВАТЬ ДОМЕН СРАЗУ ПРИ ПОКУПКЕ
Также смотрите модули:
Accordion & Tabs & Steps, Faq & HowTo Microdata, any place & content
Smart Video Widgets - видео в фоне, баннера, изображения, уведомления с настройкой условий показа
Google Reviews - отзывы с гугл карт (Google Business) с виджетом доверия + отзывы о товарах