Hướng dẫn cài lazyload imges hình ảnh web html, xenforo số 1

Hướng dẫn cài lazyload imges hình ảnh web html, xenforo dễ số 1 luôn đây. Bạn dễ dàng lazyload images cho web html, xenforo trong thẻ <img> cực dễ cho toàn bộ website.

Lazyload imges để tối ưu seo speedgoogle.

Việc Lazyload imges rất cần thiết trong seo web. Vì nó góp phần vào tối ưu tốc độ tải website giúp trải nghiệm người dùng tốt hơn.

Trì hoãn tải các hình ảnh ngoài màn hình: Nếu bạn dung google speed chấm điểm web, chắc chắc thấy qua dòng này.

Web rao vặt 1doi1 cũng từng bị lỗi này vì dùng hình ảnh cho trang chủ bằng ảnh bên ngoài ( ảnh từ web khác, hoặc ảnh từ chính website 1doi1 )

Sai khi cài xong web rao vặt mình đã hoàn toàn fix được lỗi đấy! Và mình sẽ share lại kinh nghiệm cho anh em cùng tham khảo cho web cá nhân của anh em.

Tải Lazyload imges cho web html, xenforo

Mình dùng của tác giả tuupola/lazyload

Tải lazyload cho hình bằng cách vào link sau đây:

Mã:

https://github.com/tuupola/lazyload

Bấm vào chữ Code > download zip để tải toàn bộ file trên website github



Khi đã tải về xong, giải nén ra. Bạn sẽ thấy 1 file có tên "lazyload.min.js". Giờ hãy tải file đó lên host của bạn. Có thể tải ngang hàng với file index của web. Hoặc cho nó vào fodel tùy bạn.

Cài lazyload cho hình ảnh trên web

Mở file code web của bạn lên, và tìm đến đoán </head> . Trên xenforo nó nằm trong template > PAGE_CONTAINER

Sau đó copy một trong 2 đoạn code bên dưới.

Copy file bên dưới: ( vì mình để file trong thư mục lazyload-images )

Mã:

<script src="lazyload-imges/lazyload.min.js"></script>

Code này cho ai để file ngang hàng với file index của web: ( không chứa trong fodel )

Mã:

<script src="lazyload.min.js"></script>

Chèn code vào phía trước thẻ </head>



Tiếp theo, tìm các code <img ......> trong web của bạn. Nếu thấy cấu trúc là:
<img src= . Thì hãy thay lại thành <img class="lazyload" data-src=

Như vậy là xong, hình ảnh đó đã có lazyload. Và fix lỗi Trì hoãn tải các hình ảnh ngoài màn hình cũng được giải quyết xong.

Chúc các bạn thành công!