Cách chuyển định dạng ảnh từ JPG/PNG sang WebP cho Blospot

Chuyển định dạng ảnh từ JPG/PNG sang WebP cho Blospot giúp tự động chuyển tất cả ảnh trên website sang định dạng WebP, một chuẩn ảnh hiện đại của Google, giúp giảm dung lượng nhưng vẫn giữ chất lượng hình ảnh cao. Kết hợp với lazy load, các ảnh chỉ được tải khi người dùng cuộn tới, giúp tăng tốc độ tải trang, cải thiện trải nghiệm người dùng và tối ưu SEO.

Cách chuyển định dạng ảnh từ JPG/PNG sang WebP

Chèn đoạn Code sau vào trước thẻ đóng </body>

<script>

//<![CDATA[

(function () {

  function convertToWebP(img) {

    if (!img || !img.src) return;

    var src = img.src;

    // Kiểm tra đúng ảnh Blogger (cả domain cũ và mới)

    if (

      src.indexOf('bp.blogspot.com') > -1 ||

      src.indexOf('blogger.googleusercontent.com') > -1

    ) {

      // Nếu chưa có WebP

      if (src.indexOf('-rw') === -1) {

        var newSrc = src

          // Chuẩn hóa size + thêm WebP

          .replace(/\/(s|w)[0-9]+(-[a-z0-9]+)?\//i, "/s1600-rw/")

          // Xóa query tránh lỗi

          .split('?')[0];

        // Chỉ thay nếu khác

        if (newSrc !== src) {

          img.src = newSrc;

        }

      }

    }

  }

  // Chạy lần đầu khi load trang

  document.addEventListener("DOMContentLoaded", function () {

    var images = document.querySelectorAll("img");

    images.forEach(convertToWebP);

  });

  // Theo dõi ảnh load thêm (lazy load, ajax…)

  var observer = new MutationObserver(function (mutations) {

    mutations.forEach(function (mutation) {

      mutation.addedNodes.forEach(function (node) {

        if (node.tagName === "IMG") {

          convertToWebP(node);

        }

        if (node.querySelectorAll) {

          var imgs = node.querySelectorAll("img");

          imgs.forEach(convertToWebP);

        }

      });

    });

  });

  observer.observe(document.body, {

    childList: true,

    subtree: true

  });

})();

//]]>

</script>

Lưu lại và kiểm tra kết quả?