Hướng dẫn thêm Lazy Load cho quảng cáo Google Adsense

Khả Hân31 Tháng Mười, 2022

284 2 phút đã đọc

Chắc hẳn các bạn đang sử dụng Google Adsense để phân phát quảng cáo trên Blog để kiếm tiền đều biết một điều rằng khi gắn quảng cáo Google Adsense nên Blog nó khiến cho Blog của bạn tải trang chậm đi nếu không muốn nói là rất chậm. Bài viết này mình sẽ chia sẻ cho các bạn cách tối ưu và giúp Blog của bạn tải nhanh hơn khi gắn quảng cáo của Google Adsense và cách mình muốn chia sẻ ở bài viết này là sử dụng Lazy Load. Vậy đầu tiên Lazy Load là gì?

Lazy Load là gì?

Lazy load hay lazy loading là 1 kĩ thuật tối ưu khi làm web, thay vì tải toàn bộ trang web và render ngay từ đầu, kỹ thuật này cho phép tải ngay các thành phần cần thiết để hiển thị tới người dùng và trì hoãn các tài nguyên còn lại cho đến khi cần.

Ưu điểm của Lazy Loading

Cải thiện trải nghiệm người dùng.
Nâng cao website performance.
Tiết kiệm tài nguyên.
Gia tăng điểm số đánh giá website.

Google cũng luôn khuyên các nhà xuất bản cải thiện tốc đọ tải trang nhanh hơn. Họ luôn phát triển nhiều công cụ và bài viết để giúp các nhà xuất bản cải thiện tốc độ trang web. Để cải thiện tốc độ của trang web, Google khuyên bạn nên Lazy Loading để hạn chế những hình ảnh không xuất hiện tại màn hình đầu tiên.

Tiếp theo đến với vấn đề chính mình sẽ hướng dẫn hay chia sẻ cho các bạn thêm đoạn code Lazy Load cho Google Adsense để giúp Blog của bạn tải nhanh hơn.

Bước 1: Các bạn truy cập vào trang chỉnh sửa HTML của bạn hay WordPress, Blogger,….

Bước 2: Tìm và xoá thẻ script của Google Adsense đi, code có dạng:

<script async='async' src='//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'><script>

Bước 3: Copy và dán đoạn JavaScript bên dưới vào phía trước thẻ </body>.

<script>//<![CDATA[ 
window.addEventListener("scroll", function() {
    var adsenseCodehay = document.createElement("script");
    adsenseCodehay.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
    adsenseCodehay.async = true;
    adsenseCodehay.setAttribute('crossorigin', 'anonymous');
    adsenseCodehay.setAttribute('data-ad-client', 'ca-pub-xxxxxxxxxxxxxxxxx');
    document.body.appendChild(adsenseCodehay);
}, true);
//]]></script>