Cách sử dụng webp trong Wordpress

Cách sử dụng webp trong Wordpress


Ngày 19 Tháng 1 Năm 2023

Thông thường hình ảnh sẽ chiếm gần một nữa kích thước tệp của trang web. Do đó việc chọn định dạng hình ảnh phù hợp sẽ giúp ích cho việc cải thiện tốc độ trang web. Trong bài viết hôm nay mình sẽ giới thiệu về webp và cách sử dụng nó trong Wordpress nha.

Webp là gì?

WebP là một định dạng hình ảnh hiện đại do Google phát triển có thể giúp bạn giảm kích thước hình ảnh mà không thay đổi quá nhiều về chất lượng hình ảnh. Nó sẽ giúp giảm kích thước file hình ảnh của bạn từ 25% đến 30% so với hình ảnh gốc. Điều này giúp làm tăng tốc độ cho trang web cũng như giúp bạn giảm được dung lượng lưu trữ.

  • Đối với file JPEG: có kích thước nhỏ hơn từ 25 đến 34%.
  • Đối với file PNG:có kích thước nhỏ ơn 26%.

Do còn mới nên nó chỉ hỗ trợ đối với các trình duyệt phổ biến hiện nay như Chrome, Firefox, Edge, Safari và Opera.

Định nghĩa Webp

Cách sử dụng webp trong Wordpress

Từ phiên bản Wordpress 5.8 trở lên thì bạn có thể tải file webp như các định dạng hình ảnh khác. Tuy nhiên với một số người dùng sử dụng các trình duyệt cũ hay không hỗ trợ webp thì họ sẽ không xem được hình ảnh trong website của bạn. Do đó để chắc chắn là tất cả người dùng có thể xem được hình ảnh khi bạn sử dụng định dạng webp thì mình khuyên chúng ta nên sử dụng plugin.

ShortPixel

ShortPixel là plugin phổ biến được sử dụng để tối ưu hóa hình ảnh WordPress, tự động thay đổi kích thước hoặc nén hình ảnh tải lên trong trang web WordPress. Ngoài ra nó cũng giúp bạn tự động chuyển đổi hình ảnh sang định dạng WebP cũng như cung cấp những hình ảnh đó cho các trình duyệt hỗ trợ.
ShortPixel có gói miễn phí cho phép tối ưu hóa miễn phí ~100 hình ảnh mỗi tháng. Các gói trả phí bắt đầu ở mức 4,99 đô la mỗi tháng cho tối đa 5.000 hình ảnh/ một tín dụng.

Để bật định dạng hình dạng webp thì bạn sẽ:

  • Chọn Setting -> ShortPixel
  • Tiếp thao bạn vào mục Advance -> chọn check box WebP Images.
  • Sau đó bạn check vào box có tên là Deliver the WebP...
  • Tiếp tục bạn check vào box có tên là Using the PICTURE tag syntax
  • Cuối cùng bạn chọn Only via WordPress hooks selection
ShortPixel
ShortPixel

Imagify

Nó có thể tự động nén và thay đổi kích thước hình ảnh mà bạn tải lên, giúp bạn chuyển đổi những hình ảnh này thành WebP và cung cấp các phiên bản hình ảnh tùy thuộc vào trình duyệt của người dùng.

Nó tính phí dựa trên kích thước của tệp hình ảnh. Do đó nếu bạn cần tối ưu nhiều hình ảnh thì Imagify là một lựa chọn hợp lý. Với phiên bản miễn phí thì bạn có thể tối ưu 25MB hình ảnh mỗi thàng.

Để sử dụng định dạng webp thì bạn sẽ thục hiện như sau:

  • Bạn vào Setting -> Imagify
  • Sau đó bạn chọn ô Create webp versions of images
  • Tiếp tục bạn chọn Display images in webp format…
  • Kế tiếp bạn chọn vào nút use picture tags
Imagify
Imagify

Tổng kết:

Qua đây mình mong bài viết sẽ cung cấp cho bạn cách sử dụng định dạng webp cho trang wordpress và Wordpress.org. Nếu có thắc mắc gì cứ gửi email mình sẽ phản hồi sớm nhất có thể. Rất mong bạn tiếp tục ủng hộ trang web để mình có thể viết nhiều bài hay hơn nữa nhé. Chúc bạn có một ngày vui vẻ!