Dimensione / miniatura dell'immagine personalizzata - Ritaglia per proporzioni anche quando l'immagine di origine è più piccola delle dimensioni impostate

Normalmente quando si imposta una dimensione dell'immagine personalizzata usando il ritaglio duro, ad esempio add_image_size( 'custom-size', 400, 400, true );, si ottengono i seguenti risultati:

• # 1 Immagine caricata: 600x500> Miniatura: 400x400.
• # 2 Immagine caricata: 500x300> Miniatura: 400x300.
• # 3 Immagine caricata: 300x200> Miniatura: 300x200.

Tuttavia, ciò che mi piacerebbe fare è quando l'immagine caricata è più piccola della larghezza impostata, dell'altezza o di entrambe, della dimensione dell'immagine personalizzata, ad esempio esempi n. 2 e n. 3 precedenti, invece di ritagliare l'immagine per adattarla all'interno di quelle dimensioni - è anche ritagliato per adattarsi alle proporzioni (che in questo caso è 1: 1) in questo modo:

• # 1 Immagine caricata: 600x500> Miniatura: 400x400.
• # 2 Immagine caricata: 500x300> Miniatura: 300x300 .
• # 3 Immagine caricata: 300x200> Miniatura: 200x200 .

Non credo che ciò sia possibile utilizzando le opzioni standard add_image_size, ma è possibile utilizzare una funzione diversa o un hook che modifica la funzione add_image_size?

O c'è un plugin che aggiunge questa funzionalità?

Qualsiasi informazione che chiunque può fornire sarebbe molto apprezzata.

Hai ragione che non funziona così.

Se va bene pensare alla tua domanda al contrario, puoi ottenere il risultato giusto nei browser moderni usando una selezione di dimensioni e immagini reattive.

Se usi un codice come questo:

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 );

... e nei tuoi modelli qualcosa come:

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

... quindi per impostazione predefinita (WP 4.4 e versioni successive) otterrai un tag immagine con la versione più piccola del tuo set come le srcdimensioni più grandi srcsetdell'attributo, che i browser più recenti sceglieranno e visualizzeranno la versione più grande appropriata.

Quindi, se un'immagine particolare non ha una versione più grande, non importa. Un'immagine che 300x200avrà una 200x200versione fatta, quella versione sarà l'unica in HTML e tutti i browser lo mostreranno.

Ho risolto il problema modificando le immagini reattive in modo da ottenere buone prestazioni su browser che supportano srce non solo srcset.

Questa non è davvero una buona soluzione poiché è una soluzione CSS più recente e funziona solo nel 78,9% dei browser degli utenti , ma ci sono alcuni polyfill che possono superare quelle immagini e adattamenti di oggetti

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

Idealmente sarebbe meglio se le immagini più piccole fossero ridimensionate proporzionalmente al caricamento, ma non sono stato in grado di trovare una soluzione per questo.