README

(更新) 2023-02-20：此项目将被标记为付费项目，不再作为免费项目维护。有关进一步更新和技术支持，请访问Magento 2 Lazy Loading获取更多信息。我们理解这种变化可能会给用户带来不便。但是，这是为了确保模块能够更新更多有用的功能，以更好地支持 Magento 2 商店。如果您对任何功能有任何疑问或想法，请不要犹豫，通过联系我们并留下请求。

Magento 2 懒加载扩展允许在需要时才显示图片，从而加快网站加载速度。懒加载提高了网站性能，并降低了因加载缓慢而导致的跳出率。

1. 文档

2. 常见问题解答

问题：我遇到了错误：Mageplaza_Core 已经被定义

答案：请在此处阅读解决方案 here

问题：哪些页面可以应用懒加载？

答案：懒加载可以应用于许多流行的页面上的图片，包括分类页面、产品详情页面、CMS 页面、结账页面、搜索页面，或相关/交叉销售/向上销售的产品块。

问题：加载事务中有多少种类型？

答案：加载事务有两种主要类型：加载图标和轻量级占位符。加载图标允许您上传任何图片作为加载图标（推荐尺寸 64x64px）。您还可以选择 3 种占位符类型，即透明、模糊和低分辨率。

问题：加载阈值是什么意思？

答案：阈值用于使图片加载更容易。您可以使用阈值参数（px）。例如，如果阈值是 200px，则图片在距离视窗 200px 以内加载。

3. 如何安装 Magento 2 懒加载扩展

通过 composer 安装（推荐）。在 Magento 2 根目录中运行以下命令

带有营销自动化（推荐）

composer require mageplaza/module-lazy-loading mageplaza/module-smtp
php bin/magento setup:upgrade
php bin/magento setup:static-content:deploy

不带营销自动化

composer require mageplaza/module-lazy-loading
php bin/magento setup:upgrade
php bin/magento setup:static-content:deploy

4. 突出功能

按需加载图片

暂停加载不可见图片

该功能使得仅加载用户在页面中查看的部分的图片。其他图片将在用户滚动到页面下一部分时加载。同样，图片将在用户查看时加载。

优化页面加载

懒加载可以显著加快页面加载速度，特别是对于长网站。您不再需要长时间等待页面打开，因为页面上所有图片不会同时加载。此功能使访客更容易查看您的页面。因此，它降低了跳出率并增加了转化率。

适用于最热门的页面

将懒加载应用于任何最常用的在线商店页面非常灵活和实用，通常包括几乎所有产品的图片。

一些常用的页面包括：

分类页面
产品页面
内容管理系统（CMS）页面
搜索页面
相关、交叉销售、向上销售块

多种懒加载效果

扩展程序为商店管理员提供了几种易于适配页面的加载效果。

占位符

透明：最有效的增强Lighthouse结果的方法。
模糊：这种效果使事务加载更加平滑。
低分辨率：模糊或像素化的加载

加载图标

支持任何加载图标进行图片加载。
灵活使用您喜欢的图标，如gif、jpg、svg和png。

调整加载点时间

在默认的Magento中，一旦用户打开页面，页面的图片就会立即加载。使用懒加载，您可以通过阈值参数使特定图片提前加载。

例如，如果您将阈值设置为200px，那么在200px内出现的图片将远离用户的可见区域。

此功能保持了图片外观的一致性，同时也节省了带宽。

随时移除懒加载

如果您不再想使用懒加载，您可以通过不同的方式将其排除

排除URL的页面：懒加载不会影响排除URL的页面（s）的图片。例如： /gear.html
排除CSS类：懒加载不会应用于具有排除CSS类的图片。例如： <img class="downloadable-product" src="lifelong.jpg">
排除文本：具有排除文本的标题或名称的图片的加载状态不会应用懒加载。例如： <img title = "lifelong" src = "download.jpg">

5. 完全功能列表

为商店管理员

开启/关闭模块
选择应用懒加载的页面：分类页面、产品详情页面、CMS页面、结账页面、搜索页面、相关/交叉销售/向上销售产品块。
通过排除URL、排除CSS类、排除图片标题/名称中的文本来移除懒加载的应用
通过加载阈值设置加载时间
选择加载类型：图标或占位符
上传和调整加载图标的大小
选择占位符类型：透明、模糊或低分辨率

面向客户

享受快速加载速度的页面
节省时间并拥有卓越体验

6. 用户指南

6.1 如何使用

使用图标处理懒加载

使用占位符处理懒加载

6.2 如何配置

登录到 Magento 管理员，转到 商店 > 设置 > 配置 > Mageplaza 扩展 > 懒加载。

常规配置

启用 = 是/否：启用/禁用扩展功能。
应用范围：选择要应用懒加载的页面。您可以选择一个或多个页面。

排除包含以下 URL 的页面：点击添加按钮输入您不希望应用懒加载的页面路径。在此字段中输入的 URL 的页面将不应用懒加载。点击删除图标删除您刚刚输入的路径。
示例:

排除 CSS 类：点击添加按钮输入您不希望应用懒加载的图像的类名。点击删除图标删除您刚刚输入的类名。
示例:

<img class = "downloadable-product" src = "lifelong.jpg">。具有 "downloadable-product" 类的图像将不应用懒加载。

排除文本：点击添加按钮输入图像标签的标题或 alt 文本。包含输入文本的标签的图像将不应用懒加载。
示例:

<img title = "lifelong" src = "download.jpg"> 或 <img name = "lifelong" src = "product.jpg">。当填写 "lifelong" 时，此图像将不应用懒加载。

加载阈值：设置产品图像到屏幕的距离，以处理懒加载。阈值范围内的产品仍将在滚动时加载。
加载类型：选择懒加载处理效果。
- 图标：使用图标处理懒加载。显示更多字段：
  - 上传图标：点击 选择文件 按钮选择在懒加载处理期间显示的图像。如果留空，将显示默认图标。点击 删除图像 按钮删除选定的图像。
  - 注意：仅支持格式为：gif、png、jpg、svg 的文件。
  - 调整图标宽度：输入在处理懒加载时显示的图像宽度。默认值为 64px。
  - 调整图标高度：输入在处理懒加载时显示的图像高度。默认值为 64px。
- 占位符：使用占位符处理懒加载。显示以下选项的 占位符类型 字段：
  - 模糊：在处理懒加载时，产品图片会模糊。
  - 低分辨率：在处理懒加载时，产品图片质量会降低。
  - 透明：在处理懒加载时，显示透明图片。