Перейти к публикации
Поиск в
  • Дополнительно...
Искать результаты, содержащие...
Искать результаты в...

YouTube lazy load & popup - вставка видео с youtube, vimeo, галерея видео, оптимизация page speed страниц из видео 2.1.1

20

   (9 отзывов)    Все дополнения автора

Seriusis
  79 127 10 636

13 изображений



    • 20.00 USD
  • Тема обсуждения
  • Дополнительные услуги

  • Заполните адрес сайта! Или нажмите на чекбокс выше, для передачи домена автору позже. Обращаем внимание, что автоматическая выдача лицензий происходит только при указании домена
Накопительные скидки
  • При покупке от 2 до 3 скидка -10% 18.00 USD
  • При покупке от 4 до 5 скидка -20% 16.00 USD
  • При покупке от 6 до 10 скидка -30% 14.00 USD
  • При покупке больше 10 скидка -50% 10.00 USD

  • +1 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 даже на ограниченном пр
  • подмена превью на свои позволит поставить нужные вам изображения для видео и украсить сайт

 

 

spacer.png

 

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/51https://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/80https://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 - более чем визуальный редактор

 

spacer.png

 

spacer.png

 



Seriusis's Other Downloads


Отзывы пользователей

  • Сейчас на странице   0 пользователей

    • Нет пользователей, просматривающих эту страницу.

×
×
  • Создать...

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

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