Каталог дополнений
Статьи и новости
Главная » Каталог дополнений » Модули » YouTube lazy load & popup - оптимизация и кастомизация iframe

YouTube lazy load & popup - оптимизация и кастомизация iframe

YouTube lazy load & popup - оптимизация и кастомизация iframe
Цена: 500 руб.
* Адрес сайта VQmod:

Адрес тестового сайта (необязательно) VQmod:

В корзину
Отложить
сравнение
Нужна платная помощь с установкой?
Каталог дополненийМодули
Автор: seriusis
Покупок: 1 (Средняя оценка: 0)
Совместимость OpenCart 2.0, OpenCart 2.1, OpenCart 2.2, OpenCart 2.3, OpenCart 3.0, OCStore 2.1, OCStore 2.3, OCStore 3.0, Opencart.pro 2.1, Opencart.pro 2.3
Модуль решает проблему долгой загрузки iframe с youtube видео на вашем сайте. Кроме того улучшает визуальную часть и дает возможность катомизации вывода видео: отображение видео в popup, установка своих превью на видео, установка произвольной иконки "play".
 
Все вставки iframe с видео на вашем сайте перед выводом на страницу будут автоматически заменены на превью видео в виде изображений, которые подтягиваются с img.youtube.com/vi.
 
ЗАЧЕМ
Все знают, что iframe с видео очень сильно загружают страницу и уменьшают скорость загрузки сайта. Особенно это ощутимо (и даже визуально видно), если на странице несолько видео (каждый iframe это доп. запросы и ресурсы).
 
Для сравнения, я замерял демо сайт, где на странице с 6 видео page speed показывает пк-моб 49/33 без модуля. После включения модуля результат вернулся в зеленую зону и показывает 75/92.
 
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 75/92 -  https://developers.google.com/speed/pagespeed/insights/?hl=uk&url=https%3A%2F%2Foc23.likedev.pro%2F6-video 
Страница та же, только в первом случае добавлен параметр ?disable-video-optim , чтобы модуль не срабатывал и можно было увидеть разницу. 

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

1 видео - разница 10-30%
Модуль выключен:
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 стили кастомизировать превью как нам угодно.
 
ВОЗМОЖНОСТИ
  • запуск видео по клику на превью
  • всплывающеее окно с видео по клику на превью
  • произвольные изображение для превью
  • выбор размера превью
  • установка своей иконки на кнопку 'play' (font awesome, html) и ее стилизация через css
  • возможно указать пути для исключения работы модуля
  • поля для камтомных стилей и js
 
ДЕМО
Админка https://oc23.likedev.pro/admin/   логин/пароль: demo/demo
https://oc23.likedev.pro/6-video
 
ОСОБЕННОСТИ
  • будет работать на всех шаблонах
  • максимально легкий модуль без зависимостей (всего пару строк css и ванильного js)
  • будет работать даже без бутстрапа и jquery
  • открытый код
 
 
УСТАНОВКА
Через установщик в админке загружаете архив модуля ocmod для своей версии опенкарт. 
Для версий 2.x убедитесь, что у вас уже установлен модификатор localcopy.ocmod, если его нет - установите.
 
 
ЛИЦЕНЗИЯ 
Лицензия выдается на один домен. Также при необходимости на тестовый поддомен. Для получения ключа обращайтесь в лс или на почту seriusisu@gmail.com, сразу указывайте данные о покупке: номер заказа и домен
 
Приветствую дельные предложения по развитию и расширению модуля.

ДРУГИЕ МОДУЛИ
Accordion & Tabs & Steps, Faq & HowTo Microdata, any place & content | шорткоды, popup, вставка модулей, баннера, галлереи
Основное
Способ распространения Платно
Совместимость OpenCart 2.0, OpenCart 2.1, OpenCart 2.2, OpenCart 2.3, OpenCart 3.0, OCStore 2.1, OCStore 2.3, OCStore 3.0, Opencart.pro 2.1, Opencart.pro 2.3
VQmod Нет
Ocmod Да
Статистика
В первый раз файл добавлен 12.11.2020
Последнее изменение 27.11.2020
Просмотров 188
Покупок 1

Написать

Ваше Имя:


Ваш отзыв: Внимание: HTML не поддерживается! Используйте обычный текст.

Оценка: Плохо           Хорошо

Введите код, указанный на картинке:




Продолжить


Файлы будут доступны после покупки


Метки: youtube, lazy load, iframe, видео на странице, оптимизация, pagespeed, page speed


Ещё никто не оставил комментариев к записи.
 
telegram, viber, whatsapp, телефон +7-952-3190-952 skype cdqpru почта help@liveopencart.ru вконтакте liveopencart