Lazy load 1.4.3: руководство владельца магазина
Плагин Lazy load откладывает загрузку изображений и iframe на витрине магазина, пока они не окажутся в области видимости покупателя. Страница открывается быстрее, браузер не скачивает картинки, до которых покупатель не дошёл. Это руководство для владельца интернет-магазина на Webasyst Shop-Script: программировать не нужно, всё настраивается в административной части.
Версия: Lazy load 1.4.3. Руководство написано по коду и интерфейсу этой версии; сверяйтесь со страницей плагина в магазине Webasyst и историей обновлений.
Что делает плагин
- Подменяет в HTML витрины теги
imgиiframeтак, чтобы файл загружался только при подходе к экрану. - Оставляет у картинок атрибут
src: поисковый робот видит картинки даже без JavaScript. - Не трогает первые картинки страницы (по умолчанию пять), чтобы верхний экран не замедлялся.
- Умеет предзагрузку по вертикали и горизонтали, плавное появление, автоматические
widthиheight. - Поддерживает фоновые изображения из CSS, видео YouTube с «обложкой» и размытые заглушки LQIP.
- Позволяет исключить страницы, картинки по классу или атрибуту и целые блоки.
Чего плагин не делает
- Не работает в административной части: только на витрине приложения «Магазин».
- Не работает в Internet Explorer и браузерах без Intersection Observer API: там картинки грузятся как обычно.
- Не сжимает и не уменьшает сами файлы. Для этого есть плагин «Изображения PRO».
Как читать руководство
| Глава | Когда нужна |
|---|---|
| Быстрый старт | Включить плагин и проверить результат за 5 минут |
| Настройки | Предзагрузка, пропуск картинок, эффект, размеры, совместимость |
| Исключения | Отключить плагин на странице, для картинки или блока |
| Разметка для особых случаев | Фоновые изображения, YouTube, LQIP, переключение класса |
| Совместимость | Другой lazyload, «Изображения PRO», PageSpeed Insights |
| Если что-то не так | Типичные проблемы и их решения |
Что понадобится
- Магазин на Webasyst Shop-Script.
- Доступ к разделу «Магазин → Плагины» в административной части.
- Тема оформления, которая выводит стандартные хуки витрины (
{$wa->header()}и{$wa->footer()}) и подключает jQuery: плагин использует jQuery темы.