Kích thước / hình thu nhỏ của hình ảnh tùy chỉnh - Cắt tỷ lệ khung hình ngay cả khi hình ảnh nguồn nhỏ hơn kích thước đã đặt

Thông thường khi bạn đặt kích thước hình ảnh tùy chỉnh bằng cách sử dụng crop cứng - ví dụ: add_image_size( 'custom-size', 400, 400, true );bạn nhận được các kết quả sau:

• # 1 Hình ảnh được tải lên: 600x500> Hình thu nhỏ: 400x400.
• # 2 Hình ảnh được tải lên: 500x300> Hình thu nhỏ: 400x300.
• # 3 Hình ảnh được tải lên: 300x200> Hình thu nhỏ: 300x200.

Tuy nhiên, điều tôi muốn làm là khi hình ảnh được tải lên nhỏ hơn chiều rộng được đặt hoặc chiều cao hoặc cả hai, của kích thước hình ảnh tùy chỉnh, ví dụ: ví dụ # 2 & # 3 ở trên - thay vì hình ảnh chỉ được cắt để phù hợp trong các kích thước đó - nó cũng được cắt để phù hợp với tỷ lệ khung hình của chúng (trong trường hợp này là 1: 1) như vậy:

• # 1 Hình ảnh được tải lên: 600x500> Hình thu nhỏ: 400x400.
• # 2 Hình ảnh được tải lên: 500x300> Hình thu nhỏ: 300x300 .
• # 3 Hình ảnh được tải lên: 300x200> Hình thu nhỏ: 200x200 .

Tôi không tin điều này là có thể khi sử dụng các tùy chọn add_image_size tiêu chuẩn, nhưng có thể sử dụng một hàm khác hoặc hook để sửa đổi hàm add_image_size không?

Hoặc có một plugin có thêm chức năng này?

Bất kỳ thông tin bất cứ ai có thể cung cấp sẽ được đánh giá rất cao.

Bạn đúng rằng nó không hoạt động như vậy.

Nếu bạn nghĩ về câu hỏi của mình theo cách khác, bạn có thể nhận được kết quả đúng trong các trình duyệt hiện đại bằng cách sử dụng lựa chọn kích thước hình ảnh và hình ảnh phản hồi.

Nếu bạn sử dụng mã như thế này:

add_image_size( 'custom-size-small', 200, 200, true );
add_image_size( 'custom-size-medium', 300, 300, true );
add_image_size( 'custom-size-large', 400, 400, true );

... và trong các mẫu của bạn một cái gì đó như:

wp_get_attachment_image( $image_ID, 'custom-size-small' )

... sau đó theo mặc định (WP 4.4 trở lên), bạn sẽ nhận được thẻ hình ảnh với phiên bản nhỏ nhất từ ​​bộ của bạn dưới dạng srcvà kích thước lớn hơn trong srcsetthuộc tính, trình duyệt mới hơn sẽ chọn và hiển thị phiên bản phù hợp lớn nhất.

Vì vậy, nếu một hình ảnh cụ thể không có phiên bản lớn hơn, nó không thành vấn đề. Một hình ảnh 300x200sẽ có một 200x200phiên bản được tạo ra, phiên bản đó sẽ là phiên bản duy nhất trong HTML và tất cả các trình duyệt sẽ hiển thị nó.

Tôi đã làm việc này trong khi điều chỉnh hình ảnh phản hồi để tôi có được hiệu suất tốt trên các trình duyệt chỉ hỗ trợ srcvà không hỗ trợ srcset.

Đây không phải là một giải pháp thực sự tốt vì nó là một giải pháp CSS mới hơn và nó chỉ làm việc trong 78,9% các trình duyệt người dùng , tuy nhiên có một vài polyfills có thể vượt qua mà đối tượng điều chỉnh kích thước-hình ảnh và fitie

img {
    display: block;
    overflow: hidden;
    width: 400px;
    height: 400px;
    -o-object-fit: cover;
       object-fit: cover;
}

Lý tưởng hơn là sẽ tốt hơn nếu những hình ảnh nhỏ hơn được chia tỷ lệ khi tải lên, nhưng tôi không thể tìm ra giải pháp cho điều đó.