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

Coolt

Well-known member
Diamond
Elite
XNullUser
Joined
Dec 20, 2021
Messages
329
Reaction score
276
Points
63
NullCash
2,934
- 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
329
Reaction score
276
Points
63
NullCash
2,934
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.
 

momidit521

Member
XNullUser
Joined
Apr 20, 2021
Messages
145
Reaction score
4
Points
18
NullCash
3
wow!!! grazie
 

amir_561

Well-known member
Diamond
Elite
XNullUser
Joined
Aug 20, 2019
Messages
1,826
Reaction score
143
Points
63
NullCash
24
thanx
 

x50902Ty

Active member
Elite
XNullUser
Joined
Mar 21, 2021
Messages
900
Reaction score
177
Points
43
NullCash
209
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
329
Reaction score
276
Points
63
NullCash
2,934
It works fine i tested it with 3 themes.
 

Coolt

Well-known member
Diamond
Elite
XNullUser
Joined
Dec 20, 2021
Messages
329
Reaction score
276
Points
63
NullCash
2,934
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

Member
XNullUser
Joined
Aug 29, 2020
Messages
990
Reaction score
1
Points
18
NullCash
9
thnx fo this free stuffffffffffffffffffff
 
Top