Cách sử dụng Lazy Load để tải hình ảnh trong WordPress

Bạn có muốn học cách sử dụng tính năng tải chậm để tải hình ảnh vào WordPress không?

Lazy Load là một kỹ thuật cho phép trang web của bạn chỉ tải các hình ảnh khi người dùng cuộn xuống một hình ảnh cụ thể, điều này giúp giảm thời gian tải trang web và cải thiện hiệu suất của trang web.

Hầu hết các trang web phổ biến có nhiều hình ảnh sử dụng Lazy Load để tăng tốc độ và hiệu suất của trang web.

Trong bài viết này, chúng tôi sẽ hướng dẫn bạn cách tải hình ảnh vào WordPress bằng cách sử dụng Lazy Load.

Tại sao lười tải hình ảnh trong WordPress?

Việc tải hình ảnh của bạn trên WordPress một cách lười biếng có thể tăng tốc trang web của bạn và cung cấp trải nghiệm người dùng tốt nhất.

Không ai thích các trang web chậm. Trên thực tế, một nghiên cứu về hiệu suất cho thấy thời gian tải trang chậm một giây dẫn đến ít chuyển đổi hơn 7%, số lần xem trang ít hơn 11% và mức độ hài lòng của khách hàng thấp hơn 16%.

Các công cụ tìm kiếm như Google cũng không thích các trang web tải chậm. Đó là lý do tại sao các trang web nhanh hơn xếp hạng cao hơn trong kết quả tìm kiếm.

Hình ảnh mất nhiều thời gian nhất để tải trên trang web của bạn so với các phần tử web khác. Nếu bạn thêm nhiều hình ảnh vào bài viết của mình, mỗi hình ảnh sẽ làm tăng thời gian tải trang của bạn.

Một cách để xử lý tình huống này là sử dụng Dịch vụ CDN. CDN sẽ cho phép người dùng tải xuống hình ảnh từ máy chủ web gần họ nhất và giảm tốc độ tải trang web.

Tuy nhiên, hình ảnh của bạn sẽ vẫn tải và sẽ ảnh hưởng đến thời gian tải trang tổng thể. Để giải quyết vấn đề này, bạn có thể trì hoãn việc tải hình ảnh bằng cách triển khai tải chậm hoặc Tải chậm trên trang web của mình.

Làm thế nào để tải hình ảnh lười biếng hoạt động?

Thay vì tải tất cả hình ảnh của bạn cùng một lúc, tải chậm chỉ tải xuống những hình ảnh hiển thị trên màn hình của người dùng. Nó thay thế tất cả các hình ảnh khác bằng một hình ảnh giữ chỗ hoặc một không gian trống.

Khi người dùng cuộn xuống, trang web của bạn sẽ tải hình ảnh hiển thị trong vùng hiển thị của trình duyệt.

Tải chậm có thể rất có lợi cho blog WordPress của bạn.

• Nó làm giảm thời gian tải ban đầu của trang web, do đó người dùng sẽ thấy trang web của bạn nhanh hơn
• Nó tiết kiệm băng thông bằng cách chỉ cung cấp hình ảnh tại thời điểm xem và có thể tiết kiệm chi phí lưu trữ

Bản phát hành của WordPress 5.5 đã thêm tính năng tải chậm làm tính năng mặc định.

Tuy nhiên, nếu bạn muốn tùy chỉnh cách tải hình ảnh của mình một cách chậm rãi và hình ảnh nền tải chậm, bạn sẽ cần sử dụng Plugin WordPress.

Lưu ý: Mặc dù tải chậm hay Lazy Load sẽ giúp cải thiện tốc độ tải trang web, nhưng bạn nên luôn tối ưu hóa hình ảnh cho web trước khi tải chúng lên WordPress để có hiệu suất tối đa.

Chúng tôi sẽ chia sẻ hai plugin WordPress điều này có thể giúp bạn dễ dàng định cấu hình tải chậm trên hình ảnh WordPress.

Phương pháp 1. Tải hình ảnh lười biếng trong WordPress với WP Rocket

Chúng tôi khuyên bạn nên sử dụng plugin WP Rocket để tải hình ảnh vào WordPress một cách lười biếng. Đây là plugin bộ nhớ đệm WordPress tốt nhất trên thị trường và nó cho phép bạn dễ dàng kích hoạt tải hình ảnh lười biếng.

Ngoài ra, nó là một plugin rất mạnh mẽ giúp bạn tối ưu hóa tốc độ trang web của mình mà không cần biết các thuật ngữ kỹ thuật phức tạp.

Sau khi cài đặt và kích hoạt, tất cả các cài đặt bộ nhớ đệm được đề xuất mặc định của nó sẽ tăng tốc đáng kể trang web WordPress của bạn.

Để kích hoạt tính năng tải chậm của hình ảnh, bạn chỉ cần đánh dấu vào một vài ô. Bạn thậm chí có thể bật tính năng tải chậm cho video, điều này sẽ cải thiện hơn nữa tốc độ trang web của bạn.

Phương pháp 2. Tải hình ảnh lười biếng trong WordPress với Optimole

Phương pháp này sử dụng plugin miễn phí Optimole. Đây là một trong những plugin nén hình ảnh WordPress tốt nhất và nó cho phép bạn kích hoạt tải hình ảnh lười biếng một cách dễ dàng.

Nếu bạn nhận được hơn 5 khách truy cập mỗi tháng, bạn sẽ cần phiên bản đặc biệt.

Khi kích hoạt, hãy chuyển đến Phương tiện »Optimole, sau đó đăng ký khóa API.

Chỉ cần nhấp vào nút Đăng ký và gửi khóa API qua emailVà nó sẽ được gửi qua email cho bạn.

Sau đó nhập khóa API của bạn và nhấp vào " Kết nối với Dịch vụ OptiMole '.

Sau đó, nhấp vào tab " Cài đặt ”.

Tại đây, bạn có thể đảm bảo rằng " Chia tỷ lệ hình ảnh & tải chậm" được kích hoạt. Điều này sẽ tạo ra hình ảnh dựa trên kích thước màn hình của khách truy cập và cải thiện tốc độ tải.

Sau đó nhấp vào tùy chọn menu " Nâng cao »Và chọn« Lazyload ».

Trên màn hình này, có nhiều cài đặt khác nhau cho phép bạn tùy chỉnh cách tải hình ảnh của bạn một cách lười biếng.

Trước hết, bạn có thể điều chỉnh " Loại trừ trước hình ảnh từ lazyload ". Điều này sẽ ngăn những hình ảnh đầu tiên về bài báo hoặc trang để sử dụng tải lười biếng.

Bạn có thể đặt tùy chọn này thành 0 nếu bạn muốn tải từng hình ảnh một cách chậm chạp.

Sau đó, bạn có thể kích hoạt tùy chọn " Quy mô hình ảnh '.

Điều này sẽ điều chỉnh hình ảnh với kích thước màn hình của khách truy cập và làm cho trang của bạn tải nhanh hơn.

Sau đó, bạn có thể kích hoạt cài đặt " Bật Lazyload cho hình nền '.

Thao tác này sẽ tải hình nền của bạn một cách lười biếng, có thể là một số hình ảnh lớn hơn trên trang web của bạn.

Một cài đặt khác mà bạn có thể bật là tải chậm các video và iframe được nhúng. Nếu bạn có nhiều nội dung video được nhúng, bạn nên bật cài đặt này.

Thao tác này sẽ tải hình ảnh trình giữ chỗ thay vì video. Khi bạn nhấp vào nó, toàn bộ video sẽ tải.

Bạn có thể tiếp tục tùy chỉnh các cài đặt này và xem những gì hoạt động tốt nhất cho trang web và hình ảnh của bạn.

Trước khi thoát cài đặt plugin, hãy nhớ nhấp vào " Lưu Thay đổi '.

1. ARMember

ARMember là một Plugin WordPress bảo vệ nội dung. Đó là một giải pháp độc đáo cho phép bạn bán đăng ký trên bất kỳ trang web nào. Nó có một loạt các công cụ có thể bảo vệ hoàn toàn hoặc một phần nội dung của nó.

Một tính năng khác của nó là nó cung cấp một tùy chọn miễn phí nhưng có một chút hạn chế về chức năng. Nói về tính năng, mạnh mẽ này Plugin WordPress cung cấp, trong số những thứ khác:

Khả năng lên lịch nội dung, hỗ trợ cho nhiều gói đăng ký, dễ dàng thiết lập, di chuyển giữa các gói đăng ký, Hỗ trợ thương mại điện tử, một số mẫu biểu mẫu, và nhiều hơn nữa.

Nó cũng là một tài liệu tham khảo trong thích hợp này.

Tải về | Bản demo | Web hosting 

2. Hiển thị thuế theo quốc gia cho WooCommerce

Hiển thị thuế theo quốc gia cho WooCommerce là một plugin cho phép bạn hiển thị giá của các sản phẩm có hoặc không có thuế, tùy thuộc vào quốc gia của khách truy cập. Nó cũng cho phép bạn chọn trước quốc gia thanh toán của khách truy cập.

Hãy nhớ rằng đôi khi khách hàng có thể bị nhầm lẫn vì các loại tiền tệ khác nhau và khi điều đó bao gồm thuế thì điều đó thậm chí còn phức tạp hơn. Do đó, việc hiển thị thuế theo quốc gia cho phép bạn loại bỏ những trở ngại này và đơn giản hóa quy trình mua hàng.

Tải về | Bản demo | Web hosting

3. Slick Popup Pro

Slick Popup Pro là một Phần mở rộng WordPress khá đơn giản và nhẹ có thể chuyển đổi bất kỳ biểu mẫu nào được tạo bởi plugin Liên hệ Mẫu 7 trong một cửa sổ bật lên. Cô sử dụng biểu mẫu và chuyển đổi nó thành một cửa sổ bật lên đẹp và hoàn hảo đáp ứng.

Biểu mẫu bật lên có thể có một số cách sử dụng bao gồm: biểu mẫu thu thập thông tin, Mẫu liên hệ, biểu mẫu đăng ký, biểu mẫu báo giá, đề xuất / biểu mẫu khiếu nại và những thứ khác.

Tải về | Bản demo | Web hosting

• Làm thế nào để cấu hình All In One SEO Pack WordPress
• Làm thế nào để cập nhật theme WordPress của bạn mua trên ThemeForest
• Cách hiển thị liên kết WordPress để đăng xuất
• Làm thế nào để cấu hình All In One SEO Pack WordPress

Kết luận

Voila! Đó là nó cho hướng dẫn này. Chúng tôi hy vọng bài viết này đã giúp bạn tìm hiểu cách tải hình ảnh một cách lười biếng trong WordPress. Đừng ngần ngại chia sẻ với bạn bè của bạn trên các mạng xã hội yêu thích của bạn. 

Tuy nhiên, bạn cũng sẽ có thể tham khảo ý kiến ​​của chúng tôi ressources, nếu bạn cần thêm các yếu tố để thực hiện các dự án tạo trang Internet của mình, bằng cách tham khảo hướng dẫn của chúng tôi về Tạo blog WordPress.

Tuy nhiên, trong thời gian chờ đợi, hãy cho chúng tôi biết về ý kiến và đề xuất trong phần dành riêng.

...