Статьи и новости

YouTube lazy load & popup - оптимизация и кастомизация iframe, увеличение page speed

Цена: 800 руб. 1 000 руб.
С 2 покупки этого товара цена: 900 руб.
С 4 покупки этого товара цена: 800 руб.
С 6 покупки этого товара цена: 700 руб.
С 10 покупки этого товара цена: 500 руб.
* Адрес сайта VQmod:

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

Нужна платная помощь с установкой?
Каталог дополненийМодули
Автор: seriusis
Покупок: 5 (Средняя оценка: 5)
Совместимость 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 это доп. запросы и ресурсы).
 

 
[b]ССЫЛКИ НА ДЕМО

6 видео - разница 30-50%[/b]
Модуль выключен:
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

 
Админка https://oc23.likedev.pro/admin/   логин/пароль: demo/demo
 
Кроме того визуально намного симпатичнее превью с иконкой, чем ютубовский iframe, да и возможность открытия видео в popup тоже очень полезна. + мы можем через css стили кастомизировать превью как нам угодно.
 
ВОЗМОЖНОСТИ
  • запуск видео по клику на превью
  • всплывающеее окно с видео по клику на превью
  • произвольные изображение для превью
  • выбор размера превью
  • установка своей иконки на кнопку 'play' (font awesome, html) и ее стилизация через css
  • возможно указать пути для исключения работы модуля
  • поля для камтомных стилей и js

ОСОБЕННОСТИ
  • будет работать на всех шаблонах
  • максимально легкий модуль без зависимостей (всего пару строк css и ванильного js)
  • будет работать даже без бутстрапа и jquery
  • открытый код
 
ВАЖНО!  Предпочтительно использовать режим POPUP для лучшей совместимости с шаблонами, разметкой и адаптивности видео. 


УСТАНОВКА
Через установщик в админке загружаете архив модуля ocmod для своей версии опенкарт. 
Для версий 2.x убедитесь, что у вас уже установлен модификатор localcopy.ocmod, если его нет - установите.
Видео установки (только фикс не нужен)
 

ЛИЦЕНЗИЯ 
Лицензия выдается на один домен. Также при необходимости на тестовый поддомен. 
Для получения ключа обращайтесь в лс или на почту seriusisu@gmail.com, сразу указывайте данные о покупке: номер заказа и домен
Теперь ключ будет выслан автоматически на почту покупателя сразу после вашего заказа. Если по какой-то причине письма нет - пишите на почту или в лс.
 
Приветствую дельные предложения по развитию и расширению модуля.

ДРУГИЕ МОДУЛИ
Accordion & Tabs & Steps, Faq & HowTo Microdata, any place & content | шорткоды, popup, вставка модулей, баннера, галлереи

1.0.1
  • исправление ошибок
  • улучшение совместимости с разными вариантами iframe вставок
  • исправление ошибки autoplay
Основное
Способ распространения Платно
Совместимость 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
Последнее изменение 06.09.2021
Просмотров 871
Покупок 5

Написать

Ваше Имя:


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

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

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






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




 
telegram, viber, whatsapp, телефон: +7-952-3190-952 skype: cdqpru почта: help@liveopencart.ru вконтакте: liveopencart чат: liveopencartсhat