有许多不同的方法可以在你的网站上实现慢速加载。欢迎你看一下我们为WordPress提供的支持慢速加载的顶级插件的排名表。
在WordPress目录中,有许多免费的插件,可以用来懒惰地加载图片和视频。在考虑了几十个插件并测试了几个之后,我们发现有两个插件可以显著提高网站性能。如果你热衷于实施懒惰加载,请考虑下面的选项。
内容
使用WP火箭(高级版)
WP Rocket是在你的网站上实施慢速加载的最直接的方法。 此外,启用它的过程需要不到一分钟。LazyLoad是WP Rocket包含的插件的名称,作为其懒惰图像加载的版本。
当LazyLoad开启时,WP Rocket会立即停止WordPress的原生图片懒加载,以防止任何可能的问题。
按照下面的步骤来启用WP Rocket的LazyLoad功能:-
- 你可以通过在你的WordPress安装中导航到设置>WP火箭>媒体面板来激活LazyLoad。
- 点击屏幕顶部LazyLoad区域下的 "启用图片"。
- 在作出选择后点击 "保存更改"。
这就是必须要做的其他事情。因此,访问者会遇到照片加载迟缓的情况。
LazyLoad为额外的HTML元素,如iframes和视频,提供了懒惰的加载,与WordPress提供的原生方法相反。此外,如果这种图片被内联应用于特定的HTML组件,它将对背景图片使用懒惰加载。
如果你希望使用WordPress的原生图片懒惰加载功能,你可以在WP Rocket中停用LazyLoad选项。另一方面,新的加载属性还没有被所有的浏览器支持。此外,WordPress的安装只专注于照片。因此,WP Rocket的LazyLoad仍然是优越的选择,特别是如果你的网站有许多图片、视频和嵌入物。
激活WP Rocket的Native Lazy Loading时需要注意的事项
即使WP Rocket不包括自动兼容使用原生懒人加载的Chrome浏览器,你仍然可以选择支持Chrome的原生懒人加载,通过帮助插件启用它。同样,即使WP Rocket不包括自动兼容其他使用原生懒加载的浏览器,情况也是如此。
通过使用这个有用的插件,你可以确保以下事项。
- 你的每一张照片都将包含使用本地懒惰加载的基本HTML语法;与Chrome兼容的浏览器将自动利用本地懒惰加载;所有其他浏览器将自动使用WP Rocket的懒惰加载。
- 你可以选择继续利用我们强大的LazyLoad技术,或切换到Chrome浏览器内置的懒人加载功能。
这一切都取决于你!首先,在你的所在地进行两种方法的试验,并选择最适合你的一种。
使用a3 Lazy Load (免费)
如果你正在寻找一个免费的选择,我们建议使用 a3懒惰加载插件。你可以使用a3插件禁用特定图像和页面的懒惰加载。此外,它允许在你的网站上延迟加载视频。
此外,这个插件还可以协助懒惰地加载外部图片和视频。WordPress的核心实现并不进行这样的操作。
你可以从你的WordPress仪表板安装和激活这个插件。现在,你可以定制该工具的设置。
第2步:调整插件图像设置
接下来进入设置 > a3 Lazy Load。如果你看下懒惰加载激活,该插件在安装后被默认激活。
现在,打开LazyLoad图片标签。你可以(1)挑选哪些网站图片要延迟加载,(2)为拒绝接受JavaScript的网络浏览器提供一个退路。对于那些你不想延迟加载的图片,你可以(3)设置一个CSS类。
默认设置中启用了每一个选项。我们强烈建议你保持这一设置。创建一个CSS类,允许你跳过特定图像的延迟加载。
第3步:调整插件视频设置
Lazy Load Videos and iframes标签是下一个步骤。有了a3 Lazy Load,你可以为特定的片段选择延迟加载,就像你可以选择图片一样。
该插件允许(1)内容和小工具中的视频,并为不支持JavaScript的浏览器提供了(2)回退功能。
你可以在视频设置(3)中指定一个CSS类,以排除特定视频的延迟加载。如果你想要一个更直接的配置,使用你在图像部分选择的相同类。
更多WordPress的懒惰加载插件
除了WP rocket & a3 Lazy Load之外,还有几个有用的懒惰加载插件,你可以考虑。
- 视频的懒惰加载
- BJ Lazy Load
- 为WooCommerce加载更多产品
- WordPress无限滚动--Ajax加载 更多
- Disqus条件性加载
- 懒惰加载的评论
最后的想法
每当你更新或修改你的网站时,意识到任何潜在的冲突是至关重要的。如果你发现允许懒惰加载导致你的网站的任何方面无法运行,请查看这个与懒惰加载有关的频繁问题清单。
由于懒人加载功能没有应用于Revolution Slider和Envira Gallery等插件上传的图片,因此有可能出现不兼容的情况。整个兼容插件的列表可以在这里找到。
这篇文章以及其他许多文章都可以在海鹰媒体博客上找到。