Loại bỏ Auto Sizes CSS trên WordPress 6.7

Loại bỏ Auto Sizes CSS trên WordPress 6.7 và các phiên bản mới hơn.

Nếu bạn chưa biết thì kể từ phiên bản WordPress 6.7, các lập trình viên đã chèn thêm một đoạn inline styles CSS vào mã nguồn HTML của website. Đoạn CSS này nhằm hỗ trợ cho tính năng lazy load hình ảnh mặc định của WordPress. Tuy nhiên, có vẻ nó hoạt động chưa được như mong đợi khi gây ra tình trạng lỗi kích thước hình ảnh trên nhiều website. Nó cũng trở nên rất vô dụng nếu bạn đang sử dụng tính năng lazy load hình ảnh của theme hoặc bằng các plugin khác.

Tham khảo thêm:

• Vô hiệu hóa lazy load hình ảnh mặc định của WordPress
• Loại bỏ Classic Theme Styles CSS trong WordPress

Auto Sizes CSS là gì?

Khi xem mã nguồn HTML của website (chạy WordPress 6.7 hoặc mới hơn), các bạn sẽ thấy một dòng code nằm ở ngay phần đầu, trông như hình bên dưới.

Nó được gọi là Auto Sizes CSS.

Loại bỏ Auto Sizes CSS

Như đã nói ở trên, nếu website của bạn gặp lỗi sai kích thước hình ảnh hoặc bạn không sử dụng tính năng lazy load hình ảnh mặc định của WordPress thì hoàn toàn có thể loại bỏ Auto Sizes CSS một cách an toàn.

Đối với theme Paradise

1. Hãy cập nhật theme Paradise lên phiên bản 6.8.6 hoặc mới hơn.

2. Truy cập Giao diện => Tùy biến => Thiết lập giao diện => Tối ưu tốc độ => Chuyển mục Loại bỏ Auto Sizes CSS sang trạng thái Có rồi lưu lại.

Đối với các theme khác

Tất cả những gì bạn cần làm là thêm đoạn code sau đây vào trong file functions.php của theme hoặc child theme đang sử dụng. Các bạn cũng có thể sử dụng plugin Code Snippets để chèn nhằm tránh nó bị xóa mất khi cập nhật theme.

//* Remove Auto Sizes CSS
remove_action( 'wp_head', 'wp_print_auto_sizes_contain_css_fix', 1 );

Xóa cache website (nếu có) và xem mã nguồn để kiểm tra kết quả. Nó sẽ trông giống thế này.

Thật đơn giản phải không nào? Chúc các bạn thành công!

Nếu bạn thích bài viết này, hãy theo dõi blog của tôi để thường xuyên cập nhật những bài viết hay nhất, mới nhất nhé. Cảm ơn rất nhiều. :)