Hướng dẫn thiết lập lazyload cho blogspot bằng cách sử dụng thư viện lazysizes được ưa chuộng nhất hiện nay và nhiều developers sử dụng và khuyên dùng.
Tài liệu tham khảo: https://web.dev/use-lazysizes-to-lazyload-images
Cách làm này giúp tăng tốc tải trang cho blogspot hoặc trang web.
Các bước thực hiện
1. Copy thư viện bên dưới dán trước thẻ đóng </body> đây là phiên bản mới nhất.
<script async='async' defer='defer' src='https://cdnjs.cloudflare.com/ajax/libs/lazysizes/5.2.1-rc1/lazysizes.min.js'></script>
2. Chỉnh sửa cập nhật lại thẻ <img>
Ví dụ:
<img src="pic.jpg" alt="">
Sửa thành:
<img src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" data-src="pic.jpg" class="lazyload" alt="">
Các bạn tìm tất cả và sửa src thành data-src
và thêm src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" class="lazyload"Như vậy là xong, các bạn vô blog kiểm tra.
Với thủ thuật này giúp blogspot của bạn trì hoãn tải ảnh (lười tải ảnh) giúp tăng tốc độ tải trang cho blog.
[/blog]