Modul Konfiguration

Navigieren Sie zu TechDivision >> Performance & Images >> Lazyload

Allgemeine Modul-Optionen

Section Option Value Default Beschreibung

General

Enable lazy loading for images

Yes/No

Yes

Aktivieren des Moduls Lazyload

Use HTML-Lazyload

Yes/No

No

Aktivieren/Deaktivieren der nativen Lazyload-Funktionalität

Diese Option wird nicht vollumfänglich von allen Browser unterstützt!

Hier eine Übersicht für die Unterstützung.

Lazyload Blank Image (Base64 encoded)

data:image/gif

data:image/gif;base64,R0lGODlhAQABAPAAAAAAAP///yH5BAUKAAAALAAAAAABAAEAQAICRAEAOw==

Wenn Enable lazy loading for images auf Yes gesetzt ist, bitte einmal mit Save Config das Setting speichern
Nach dem Speichern sollte im Feld Lazyload Blank Image ein data:image erscheinen, als Platzhalter für fehlende Bilder
Dann bitte noch einmal mit Save Config bestätigen

Die Technik des Lazyloadings via dem JS Plugin lazysizes ist wie folgt implementiert:

Das Modul greift im Magento Prozess erst ganz am Ende des HTML Renderprozess ein um die HTML Img Tags entsprechend vorzubereiten
Bilder, die sich beim Laden einer Shopseite (CMS/Kategorie, Bluefoot/Bluefoot Teaser und Page Designer), noch nicht im sichbaren Bereich befinden, werden im HTML img→src Attribute mit einem 1x1 Pixel Gif ersetzt
Das entsprechende HTML `<img data-src `Attribute wird mit dem orginalen Bildpfad erweitert und hinzugefügt
Bilder, die sich beim Laden einer Shopseite (CMS/Kategorie, Bluefoot/Bluefoot Teaser und Page Designer), noch nicht im sichbaren Bereich befinden, werden mit der CSS Class class="lazyload" versehen
Bilder, die beim Scrollen in den sichbaren Bereich gelangen, werden mit der CSS Class class="lazyloaded" versehen (die bestehende CSS Class lazyload wird durch die CSS Class lazyloaded ersetzt)
Bilder (1x1 Pixel Gif), die beim Scrollen in den sichbaren Bereich gelangen, werden im HTML Img Tag mit dem im data-src bereitgestellten Bildpfad via JS ersetzt und so nachgeladen