v1.6-v1.7 Lazy loading module V1.0.2

Coolt

Well-known member
Diamond
Elite
XNullUser
Joined
Dec 20, 2021
Messages
358
Reaction score
325
Points
63
NullCash
3,262
- This module is used to lazy load product images.
- Compatible with all themes of Prestashop 1.6 and Prestashop1.7
- It helps dramatically to improve website pages loading and it reduces your bounce rate.
Result:
Good website experience and SEO improvement.

----------------------------------------------------

Installation on Prestashop 1.7​

  1. Download the module, install it from BO > Modules page.
  2. Edit the \themes\yourtheme\templates\catalog\_partials\miniatures\product.tpl file.
1
2
">
<img src = "{$product.cover.bySize.home_default.url}"
By this one:

1
2
3
is_stlazyloading">
<img src="{$stlazyloading.img_prod_url}{$stlazyloading.lang_iso_code}-default-home_default.jpg" class="stlazyloading_holder" width="{$product.cover.bySize.home_default.width}" height="{$product.cover.bySize.home_default.height}" alt="{if !empty($product.cover.legend)}{$product.cover.legend}{else}{$product.name}{/if}" />
<img data-src = "{$product.cover.bySize.home_default.url}" class="stlazyloadthis"




Installation on Prestashop 1.6​

  1. Download the module, install it from BO > Modules page.
  2. Edit the \themes\yourtheme\product-list.tpl file.
    1is_stlazyloading
    1<img src="{$img_prod_dir}{$lang_iso}-default-home_default.jpg" class="stlazyloading_holder" {if isset($homeSize)} width="{$homeSize.width}" height="{$homeSize.height}"{/if} />
    1stlazyloadthis
    1data-
  3. Add this code to the bottom part of the reloadContent function in the \themes\yourtheme\js\modules\blocklayered\blocklayered.js file.
    1
    2
    if (typeof(stlazyloading) == 'function')
    stlazyloading($('img.stlazyloadthis'));

Troubleshot​

If you get a message like this "en-default-home_default.jpg can not be load".
Regenerating home_default image type thumbnails for products can fix the problem.
 

Attachments

  • stlazyloading-7.zip
    14.4 KB · Views: 1

Coolt

Well-known member
Diamond
Elite
XNullUser
Joined
Dec 20, 2021
Messages
358
Reaction score
325
Points
63
NullCash
3,262
Yes, but it's not free for free!! It's free for testing purposes. Be sure that it will be deleted from the website owner after some months, and it will be a paid module. This is the system of pretashop developpers in general.
So the correct method is to upload the file here.
 

x50902Ty

Active member
Elite
XNullUser
Joined
Mar 21, 2021
Messages
900
Reaction score
184
Points
43
NullCash
258
i think it is not work in most theme ,because lazy js was not support by it.jquery have problem.
 

Coolt

Well-known member
Diamond
Elite
XNullUser
Joined
Dec 20, 2021
Messages
358
Reaction score
325
Points
63
NullCash
3,262
It works fine i tested it with 3 themes.
 

Coolt

Well-known member
Diamond
Elite
XNullUser
Joined
Dec 20, 2021
Messages
358
Reaction score
325
Points
63
NullCash
3,262
After installation you must put codes in the correct files listed in the 1st comment.
 

vass4ov82

Member
XNullUser
Joined
Sep 29, 2021
Messages
199
Reaction score
1
Points
18
NullCash
0
Works on 1.7.8 .. with some awkward space between all product-tab modules.
Yes, but it's not free for free!! It's free for testing purposes. Be sure that it will be deleted from the website owner after some months, and it will be a paid module. This is the system of pretashop developpers in general.
So the correct method is to upload the file here.
All you need to use the module is already on your server - php, css and two js files
 

mo1373

Active member
XNullUser
Joined
Aug 29, 2020
Messages
1,062
Reaction score
2
Points
38
NullCash
11
thnx fo this free stuffffffffffffffffffff
 
Top