landofcoder/module-lazyload

A Magento 2 module that adds support for lazy loading of images.

Installs: 836

Dependents: 0

Suggesters: 0

Security: 0

Stars: 1

Watchers: 2

Forks: 0

Open Issues: 0

Type:magento2-module

1.0.0 2021-03-30 10:39 UTC

This package is auto-updated.

Last update: 2024-11-05 14:35:59 UTC


README

Overview

A Magento 2 module that adds support for lazy loading of images.

Features

  • Utilises the lazysizes script to add lazy load support for images
  • Lazy loading is automatically applied to all* product images
    • *Any image created via Magento\Catalog\Block\Product\Image
    • This includes:
      • Product listing (category, search, product list widget)
      • Product relations (related, upsell, crosssell)
      • Product comparison
      • Recently viewed
      • Cart thumbnails
      • Wishlist
  • Support can be added to any further images by adding the following to <img> elements:
    • Add lazyload class
    • Change the src attribute to data-src
    • Optional: add a dummy src with transparent 1px x 1px image to avoid broken image links prior to lazy load (see product image templates as example)
  • Preloading
    • Preloading means the media source will be loaded even if not in the viewport such as megamenu icons/images.
    • The preload_elements layout argument allows you to specify selectors of which elements can be preloaded. This can be configured per page.
    • Use the lazypreload class on element(s) you wish to preload.

Compatibility

  • Magento Community Edition / Enterprise Edition 2.2.x (see older releases for 2.0 / 2.1 support)
  • Supports Magento 2 Full Page Cache (including Varnish)

Installation

composer require landofcoder/module-lazyload
php bin/magento module:enable Lof_Lazyload
php bin/magento setup:upgrade

Contributing

Issues, forks and pull requests welcomed :)