Upload ảnh WebP lên WordPress

bởi Hồng Quang Minh

Upload ảnh WebP lên WordPress hiện nay chưa được tích hợp mặc định trong mã nguồn WordPress hiện nay. Tập tin hình ảnh WebP đang được sử dụng bởi hầu hết các trang web lớn nhỏ hiện nay. Bởi nó giúp giảm kích thước tập tin xuống nhưng vẫn giữ được hình ảnh và kích thước ban đầu. Chính vì thế mà các webite mới hiện nay đều áp dung tập tin WebP để hiển thị hình ảnh.

upload ảnh webp lên wordpress

Cách Upload ảnh WebP lên WordPress

Mặc dù tập tin WebP để hiển thị hình ảnh và giúp duyệt hình tải nhanh hơn cho website. Thế nhưng nó cũng có những bất lợi về sự hiển thị hình trên trên các thiết bị khác nhau.

Viết thêm code để tải ảnh WebP lên WordPress

Cách thực hiện cũng hoàn toàn đơn giản và không quá phức tạp như bạn suy nghĩ. Bạn chỉ việc copy đoạn mã dưới đây vào function.php (file trong themes bạn đang sử dụng chính).

Ví dụ một thư mục chứa giao diện như: wp-content/themes/ten_themes/function.php

Đoạn code để chèn vào file function.php

/* Upload ảnh WebP lên WordPress. * /
function webp_upload_mimes($existing_mimes) {
$existing_mimes['webp'] = 'image/webp';
return $existing_mimes;
}
add_filter('mime_types', 'webp_upload_mimes');
/* End Upload ảnh WebP lên WordPress. */

Đến đây là bạn đã có thể upload ảnh WebP lên WordPress của mình được rồi. Bạn muốn làm thêm hiển thị hình thu nhỏ để dễ phân biệt với hình khác bằng cách dưới đây.

Hiển thị hình ảnh thu nhỏ sau khi Upload ảnh WebP lên WordPress

Nếu bạn muốn xem bản xem trước (hình thu nhỏ) khi bạn truy cập Media / Library hay Thêm Media trong bài viết, bạn phải thêm mã này bên dưới vào cuối cùng funciton.php

/* Xem trước / hình thu nhỏ cho các tệp hình ảnh webp */
function webp_is_displayable($result, $path) {
if ($result === false) {
$displayable_image_types = array( IMAGETYPE_WEBP );
$info = @getimagesize( $path );
if (empty($info)) {
$result = false;
} elseif (!in_array($info[2], $displayable_image_types)) {
$result = false;
} else {
$result = true;
}
}
return $result;
}
add_filter('file_is_displayable_image', 'webp_is_displayable', 10, 2);
/* End Xem trước / hình thu nhỏ cho các tệp hình ảnh webp. */

Giờ thì ta có thể hiển thị hình ảnh đầy đủ như một file hình ảnh bình thường rồi. Đối với những bạn không rành hay không biết cách thì có thể dùng các plugins.

Dùng Plugin để tải hình ảnh WebP lên WordPress

Nếu như cách trên bạn không biết phải làm sao hay không rành thì có thể áp dụng các plugin. Như sử dụng plugin Code Snippets (miễn phí) để thêm mã tùy chỉnh mà không cần chỉnh sửa file functions.php.

Sau khi bạn đã thêm mã, bây giờ bạn có thể tải trực tiếp hình ảnh WebP lên WordPress.

Nếu bạn muốn sử dụng một plugin, WP Enable WebP (miễn phí) sẽ cho phép bạn upload ảnh WebP lên WordPress. Ngoài ra, bạn cũng có thể dùng EWWW Image Optimizer để chuyển đổi các hình ảnh bình thường chuẩn WebP.

Lưu ý: Khi bạn có thể upload được hình ảnh WebP, bạn nên tiếp tục sử dụng các định dạng hình ảnh khác như JPEG và PNG, nhưng vẫn hiển thị bằng hình ảnh WebP nhỏ hơn (nếu có thể). Nếu bạn tải trực tiếp hình ảnh WebP lên WordPress, thì hình có thể sẽ không hiển thị trên tất cả các thiết bị và trình duyệt do không hỗ trợ WebP.

Câu hỏi thường gặp khi upload ảnh WebP lên WordPress

WebP hoạt động như thế nào?

WebP hoạt động khác nhau tùy thuộc vào việc bạn đang sử dụng nén mất dữ liệu hay không mất dữ liệu.

Nén Lossy WebP sử dụng mã hóa dự đoán, sử dụng các giá trị trong các khối pixel lân cận để dự đoán các giá trị và mã hóa sự khác biệt.

Theo Google:

Nén WebP không mất dữ liệu sử dụng các đoạn hình ảnh đã thấy để tái tạo lại các pixel mới một cách chính xác. Nó cũng có thể sử dụng bảng màu cục bộ nếu không tìm thấy kết quả phù hợp thú vị nào.

Plugin WebP nào tốt nhất cho WordPress?

Hai plugin chuyển đổi WebP chuyên dụng phổ biến nhất cho WordPress là WebP Express và WebP Converter for Media.

Các plugin nén hình ảnh tốt nhất có hỗ trợ WebP mà tôi đã thử nghiệm và dùng qua là ShortPixelSmush. Hai plugin này miễn phí số lượng có hạn, nếu vượt quá bạn phải bỏ tiền ra để sử dụng. Nhưng đối với những website nhỏ thì rất phù hợp để sử dụng bởi tiện ích nén rất tốt.

WebP có làm giảm chất lượng hình ảnh không?

Hình ảnh WebP không mất dữ liệu duy trì chất lượng hình ảnh gốc. Hình ảnh WebP bị mất chất lượng sẽ làm giảm chất lượng hình ảnh, mặc dù trong hầu hết các trường hợp, nó khó có thể nhận thấy được.

Nếu hình ảnh trang web của bạn cần có độ phân giải cao hoặc cần xem lớn trên màn hình retina, bạn cần kiểm tra trước khi nén WebP để không ảnh hưởng đến chất lượng hình ảnh.

Bạn có thể xem một mẫu hình ảnh WebP-lossless và WebP-lossyu trong thư viện hình ảnh WebP của Google .

Những trình duyệt nào hỗ trợ WebP?

WebP vốn được hỗ trợ bởi hầu hết các trình duyệt phổ biến, bao gồm Chrome, Firefox, Microsoft Edge và Opera , trên máy tính để bàn và Android. Đây là danh sách đầy đủ của tất cả các trình duyệt được hỗ trợ WebP.

WebP không được hỗ trợ phổ biến bởi tất cả các trình duyệt. Vì lý do này, bạn nên sử dụng hình ảnh WebP với JPEG / PNG làm dự phòng.

Khi nào WebP sẽ hoạt động trên Safari?

Apple hiện đã thêm hỗ trợ WebP cho Safari và iOS với việc phát hành iOS 14 và macOS Big Sur. Người dùng sử dụng phiên bản Safari cũ thì không thể hiển thị hình ảnh WebP.

Tôi có thể chuyển từ WebP trở lại JPEG không?

Nếu bạn sử dụng một plugin WordPress như ShortPixel để cung cấp hình ảnh WebP và giữ nguyên bản gốc, bạn có thể chuyển trở lại JPEG hoặc định dạng hình ảnh gốc bất kỳ lúc nào.

Bạn cũng nên lưu trữ cả hình ảnh WebP và JPEG vì không phải tất cả các trình duyệt trang web (như nhiều phiên bản cũ hơn) đều hỗ trợ định dạng WebP.

Sử dụng WebP có tốt cho SEO không?

Google đã không chính thức tuyên bố rằng việc sử dụng hình ảnh WebP sẽ cải thiện SEO và thứ hạng. Tuy nhiên, Google đã phát triển công nghệ WebP và họ cũng khuyên bạn nên cung cấp WebP và các hình ảnh nén khác để cho phép truy cập trang web nhanh hơn.

Nếu bạn sử dụng PageSpeed ​​Insights để kiểm tra tốc độ tải các trang web của mình hoạt động như thế nào, bạn sẽ thấy rằng Google khuyên bạn nên sử dụng WebP và một plugin WordPress để chuyển đổi hình ảnh của bạn sang WebP:

Đề xuất webp của Pagespeed Insights

WebP có thể giúp trang web của bạn tải trang nhanh hơn và do đó nó rất tốt cho SEO. Google đã xác nhận rằng họ sẽ tung ra một yếu tố xếp hạng tốc độ trang web chính thức được gọi là Core Web Vitals trong tương lai gần. Và thời điểm đưa trải nghiệm trên trang lên Google Tìm kiếm đã được công bố vào tháng 6/2021.

Hình ảnh WebP có cho phép siêu dữ liệu không?

Có, hình ảnh WebP có thể có siêu dữ liệu được lưu trữ ở định dạng EXIF ​​hoặc XMP.

Phần mềm nào chuyển đổi JPEG và PNG sang WebP?

Google đã tạo một công cụ chuyển đổi WebP có thể được tải xuống cho Linux, Windows và macOS. Bạn cũng có thể chuyển đổi hình ảnh sang WebP bằng dòng lệnh.

Bạn cũng có thể chuyển đổi PNG sang WEBP (trực tuyến miễn phí) hay bất kỳ file hình ảnh nào.

Tôi có thể tải hình ảnh WebP lên WordPress không?

Không, hiện tại WordPress không cho phép tải lên hình ảnh WebP. Bạn có thể kích hoạt tải lên WebP bằng cách thêm mã tùy chỉnh vào tệp functions.php themes (giao diện) WordPress mà hồng quang minh đã hướng dẫn ở trên. Bạn cũng có thể chuyển đổi hình ảnh và phân phát chúng dưới dạng tệp WebP bằng cách sử dụng plugin hoặc CDN.

5/5 - (7 bình chọn)

Bài viết liên quan