0

0

如何在 WordPress 中轻松延迟加载图像(2 种方法)

冷漠man

冷漠man

发布时间:2025-06-21 12:30:38

|

359人浏览过

|

来源于php中文网

原创

您想了解如何在 wordpress延迟加载图像吗?

延迟加载允许您的网站仅在用户向下滚动到特定图像时加载图像,这减少了网站加载时间并提高了网站性能。许多流行的图像密集型网站使用延迟加载来提高网站速度和性能。

在本文中,我们将逐步向您展示如何在 WordPress 中轻松延迟加载图像。

如何在 WordPress 中轻松延迟加载图像(2 种方法)

为什么在 WordPress 中延迟加载图像?

延迟加载 WordPress 图像可以加快您的网站速度并提供更好的用户体验。

没有人喜欢缓慢的网站。事实上,一项性能研究发现,页面加载时间延迟 1 秒会导致转化次数减少 7%,综合浏览量减少 11%,客户满意度下降 16%。

如何在 WordPress 中轻松延迟加载图像(2 种方法)

谷歌这样的搜索引擎也不喜欢加载缓慢的网站。这就是为什么速度较快的网站在搜索结果中排名较高的原因。

与其他网络元素相比,图像在网站上加载所需的时间最长。如果您在文章中添加大量图像,那么每个图像都会增加页面加载时间。

处理这种情况的一种方法是使用CDN 服务,例如BunnyCDN。CDN 将允许用户从距离他们最近的网络服务器下载图像并降低网站加载速度。

但是,您的图像仍将被加载并影响整个页面加载时间。要解决此问题,您可以通过在网站上实现延迟加载来延迟图像加载。

图像延迟加载是如何工作的?

延迟加载不是一次加载所有图像,而是仅下载用户屏幕上可见的图像。它将所有其他图像替换为占位符图像或空白区域。

当用户向下滚动页面时,您的网站会加载在浏览器查看区域中可见的图像。

延迟加载对您的WordPress 博客非常有益:

  • 它减少了初始网页加载时间,以便用户更快地看到您的网站。
  • 它通过仅传送查看的图像来节省带宽,这可以节省您的WordPress 托管成本。

WordPress 5.5的发布添加了延迟加载作为默认功能。

但是,如果您想自定义图像延迟加载以及延迟加载背景图像的方式,那么您将需要使用 WordPress 插件。

让我们看一下如何使用两个不同的插件在 WordPress 中延迟加载图像。您可以使用下面的快速链接直接跳转到您要使用的方法:

  1. 使用 WP Rocket 在 WordPress 中延迟加载图像(推荐)
  2. 使用 Optimole 在 WordPress 中延迟加载图像(免费)
  3. 优化 WordPress 图像的额外提示

方法 1:使用 WP Rocket 在 WordPress 中延迟加载图像

我们建议使用WP Rocket插件在 WordPress 中延迟加载图像。它是市场上最好的 WordPress 缓存插件,可让您轻松打开图像延迟加载。

除此之外,它是一个非常强大的插件,可以帮助您优化网站速度,而无需了解复杂的技术术语或配置专家设置。

开箱即用,他们所有默认推荐的缓存设置将大大加快您的WordPress 网站的速度。

您需要做的第一件事是安装并激活WP Rocket插件。有关更多详细信息,您可以参阅我们有关如何安装 WordPress 插件的指南。

要启用图像延迟加载,您只需选中几个复选框即可。您甚至可以启用视频延迟加载,这将进一步提高您的网站速度。

您所需要做的就是转到WordPress 仪表板中的设置 » WP Rocket,然后单击“媒体”选项卡。然后,您可以滚动到“LazyLoad”部分并选中“启用图像”和“启用 iframe 和视频”旁边的框。

如何在 WordPress 中轻松延迟加载图像(2 种方法)

有关更多详细信息,请参阅有关如何在 WordPress 中正确安装和设置 WP Rocket 的指南。

注意:如果您使用Siteground作为 WordPress 托管提供商,则可以使用具有类似延迟加载功能的免费SiteGround Optimizer插件。

甲骨文AI协同平台
甲骨文AI协同平台

专门用于甲骨文研究的革命性平台

下载

方法 2:使用 Optimole 在 WordPress 中延迟加载图像

此方法使用免费的Optimole插件。它是最好的 WordPress 图像压缩插件之一,可让您轻松启用图像延迟加载。

如果您每月的访问量超过 5,000 名,那么您将需要Optimole 的高级版本。

首先,您需要安装并激活 Optimole 插件。有关更多详细信息,请参阅我们有关如何安装 WordPress 插件的分步指南。

激活后,您将看到一个屏幕,要求您注册 API 密钥。您还可以通过导航到管理菜单中的Optimole来找到此屏幕。

如何在 WordPress 中轻松延迟加载图像(2 种方法)

您需要确保列出的电子邮件地址正确,然后单击“创建并连接您的帐户”按钮。或者,如果您是现有用户,则只需单击“我已经有 API 密钥”按钮。

当插件连接到 Optimole 时,您可能需要等待几秒钟。之后,该插件将自动开始优化您的图像,以便您的访问者现在可以看到适合其设备的最佳图像。

发生这种情况时,您可以单击“设置”选项卡来配置延迟加载。

在这里,您需要确保启用“缩放图像和延迟加载”设置。这将根据访问者的屏幕尺寸生成图像并提高加载速度。

如何在 WordPress 中轻松延迟加载图像(2 种方法)

接下来,单击“高级”菜单选项并选择“延迟加载”。在此屏幕上,有一些不同的设置可让您自定义图像延迟加载的方式。

首先,您可以调整“从延迟加载中排除第一张图像”设置。这将阻止帖子或页面顶部的图像延迟加载,因此折叠上方的图像将始终出现。

如何在 WordPress 中轻松延迟加载图像(2 种方法)

如果您希望延迟加载每个图像,可以将其设置为 0。

您可以检查 Optimole 中的其他一些高级延迟加载设置。默认情况下启用这些设置。

第一个是“缩放图像”设置。这会将图像缩放到访问者的屏幕尺寸,并使页面加载速度更快。

如何在 WordPress 中轻松延迟加载图像(2 种方法)

之后,您将看到“启用背景图像延迟加载”设置。这将延迟加载您的背景图像,这可能是您网站上最大的图像。

另一个设置是延迟加载嵌入视频和 iframe。如果您有大量嵌入的视频内容,那么您将需要保留此设置。它将加载占位符图像来代替视频。单击占位符后,将加载完整视频。

您可以继续自定义这些设置,看看什么最适合您的网站和图像。

在退出插件设置之前,请确保单击页面底部的“保存更改”按钮。

优化 WordPress 图像的额外提示

虽然延迟加载有助于提高网站加载速度,但还有一些其他方法可以优化 WordPress 图像以获得最佳性能。

例如,我们建议在将图像上传到您的网站之前使用TinyPNG或JPEGmini等工具对其进行压缩。或者,您可以使用自动图像压缩插件,例如Optimole或EWWW Image Optimizer。

为您的图像选择正确的 WordPress 图像大小和文件格式也很重要。JPEG 最适合具有多种颜色的照片或图像,PNG 适合简单或透明图像,GIF 仅适用于动画图像。

我们希望本文能帮助您了解如何在 WordPress 中延迟加载图像。您可能还想查看我们的教程如何在不损失质量的情况下轻松优化网络图像,以及我们专家精选的最佳网页设计软件。

相关专题

更多
什么是搜索引擎
什么是搜索引擎

搜索引擎是一种互联网工具,用于帮助用户在网上查找信息。搜索引擎的目标是提供最准确、最有价值的搜索结果,使用户能够快速找到所需的信息。本专题为大家提供搜索引擎相关的各种文章、以及下载和课程。

374

2023.08.02

有哪些目录搜索引擎
有哪些目录搜索引擎

目录搜索引擎有Google、Bing、Yahoo、Baidu、DuckDuckGo等。想了解更多目录搜索引擎的相关内容,可以阅读本专题下面的文章。

2395

2023.11.06

搜索引擎营销的主要模式
搜索引擎营销的主要模式

搜索引擎营销的主要模式包括:1. 竞价排名(ppc);2. 搜索引擎优化(seo);3. 本地搜索营销;4. 购物广告;5. 视频广告;6. 展示广告;7. 社交媒体营销;8. 移动广告。想了解更多搜索引擎营销的相关内容,可以阅读本专题下面的文章。

433

2024.05.20

wordpress seo
wordpress seo

WordPress网站SEO优化方法有:1、选择一个SEO友好的主题,具有清晰的代码结构,快速的加载速度和响应式设计;2、使用SEO插件,优化你的标题标签,元描述,关键字,XML站点地图等;3、优化你的内容,内容是SEO优化的核心;4、优化你的网站速度;5、创建友好的URL;6、使用内部链接;7、优化图像;8、使用社交媒体;9、定期更新你的网站;10、监控和分析你的网站等等。

415

2023.09.18

wordpress下载后怎么安装
wordpress下载后怎么安装

安装前准备:确保服务器满足要求、获取安装文件、创建数据库。上传 wordpress 文件。创建数据库和用户。运行安装程序:选择语言、输入数据库信息、网站标题和管理员信息。安装 wordpress。安装后配置:设置永久链接、安装主题、安装插件、创建内容。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

314

2024.04.15

iframe写法有哪些
iframe写法有哪些

iframe写法有基本Iframe写法、嵌套Iframe写法、自适应宽高的Iframe写法、带有样式和属性的Iframe写法、内联Iframe写法和使用JavaScript动态创建Iframe写法。种写法都有自己的特点和适用场景。根据实际需求,选择合适的写法可以实现所需的功能和效果。

481

2023.10.19

Java JVM 原理与性能调优实战
Java JVM 原理与性能调优实战

本专题系统讲解 Java 虚拟机(JVM)的核心工作原理与性能调优方法,包括 JVM 内存结构、对象创建与回收流程、垃圾回收器(Serial、CMS、G1、ZGC)对比分析、常见内存泄漏与性能瓶颈排查,以及 JVM 参数调优与监控工具(jstat、jmap、jvisualvm)的实战使用。通过真实案例,帮助学习者掌握 Java 应用在生产环境中的性能分析与优化能力。

19

2026.01.20

PS使用蒙版相关教程
PS使用蒙版相关教程

本专题整合了ps使用蒙版相关教程,阅读专题下面的文章了解更多详细内容。

61

2026.01.19

java用途介绍
java用途介绍

本专题整合了java用途功能相关介绍,阅读专题下面的文章了解更多详细内容。

87

2026.01.19

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
第二十三期_前端开发
第二十三期_前端开发

共98课时 | 7.5万人学习

WordPress视频教程
WordPress视频教程

共23课时 | 9.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号