Lỗi ảnh ở nhiều khung hình khác nhau

Khi gặp 1 trang web bị lỗi ảnh ở 1 vài khung hình nào đó. VD 600w, 100vw, 1024w, 768w, 2048w

Link web lỗi: https://xenang.com/dich-vu-cho-thue-xe-nang-hang-tai-tp-hcm/

Nguyên nhân là do 1 số ảnh ở kích thước khác nhau bị mất, bị lỗi:

  • https://xenang.com/wp-content/uploads/2024/10/dich-vu-cho-thue-xe-nang-hang-tai-tp-hcm-gia-uu-dai-915-13.jpg -> OK
  • https://xenang.com/wp-content/uploads/2022/02/cho-thue-xe-nang-hang-600×450.jpg -> Lỗi
  • https://xenang.com/wp-content/uploads/2022/02/cho-thue-xe-nang-hang-1024×768.jpg -> Lỗi
  • https://xenang.com/wp-content/uploads/2022/02/cho-thue-xe-nang-hang-400×300.jpg -> Lỗi
  • https://xenang.com/wp-content/uploads/2022/02/cho-thue-xe-nang-hang-768×576.jpg -> Lỗi
  • https://xenang.com/wp-content/uploads/2022/02/cho-thue-xe-nang-hang-1536×1152.jpg -> Lỗi
  • https://xenang.com/wp-content/uploads/2022/02/cho-thue-xe-nang-hang-2048×1536.jpg -> Lỗi

Cách xử ý: Thêm đoạn code sau vào file functions.php của theme để ngăn chặn web tạo ra nhiều phiên bản url ảnh khác nhau:

// Loại bỏ thuộc tính 'srcset' từ thẻ ảnh
add_filter( 'wp_calculate_image_srcset', '__return_false' );

// Loại bỏ thuộc tính 'sizes' từ thẻ ảnh
add_filter( 'wp_calculate_image_sizes', '__return_false' );

// Loại bỏ 'sizes' và 'srcset' cho các ảnh trong phần content
function disable_srcset_and_sizes($content) {
// Loại bỏ thuộc tính sizes
$content = preg_replace( '/\s*sizes="[^"]+"/i', '', $content );
// Loại bỏ thuộc tính srcset
$content = preg_replace( '/\s*srcset="[^"]+"/i', '', $content );
return $content;
}
add_filter( 'the_content', 'disable_srcset_and_sizes' );

Kết quả sau khi sử dụng hàm