WordPress : wp_get_attachment_image_sizes(‘large’) imprime de petites tailles

J’utilise le code suivant pour imprimer le srcset pour mon image:

<?php if ( function_exists( 'wp_get_attachment_image_srcset' ) ) :?>
srcset="<?php echo esc_attr( wp_get_attachment_image_srcset( get_post_thumbnail_id( $blog_results->post->ID, 'medium' ) ) ); ?>"
sizes="<?php  echo esc_attr(wp_get_attachment_image_sizes( get_post_thumbnail_id( $blog_results->post->ID, 'medium' ) ) ); ?>"
<?php endif; ?>

Le conteneur que j’utilise a une largeur de 350 pixels, mais WordPress renvoie ceci :

sizes="(max-width: 300px) 100vw, 300px"

Je voudrais forcer tant bien que mal pour obtenir la prochaine taille disponible car la qualité de l’image est vraiment médiocre. J’ai cherché une solution à ce problème jusqu’à présent mais sans succès.

Existe-t-il un moyen propre d’accomplir cela sans coder en dur les « tailles » ?

Solution n°1 trouvée

Cette question semble être là depuis un moment, et j’ai eu le même problème encore aujourd’hui. J’ai fait quelques recherches et j’ai découvert que cela était en fait causé par la largeur du contenu du thème. Il suffit de supprimer ou de redéfinir la largeur du contenu du thème sur un nombre souhaité pour résoudre le problème.

<?php
  // Look for the function setting content width, or create a new one in functions.php
  function mytheme_content_width() {
    $GLOBALS['content_width'] = apply_filters( 'mytheme_content_width', 300 ); // Change 300 to a bigger number
  }
  add_action( 'after_setup_theme', 'mytheme_content_width', 0 ); // Or completely remove the action.
?>

Solution n°2 trouvée

vous pouvez essayer cette approche.

Première:

//$name = Image size identifier.
//$width = Image width in pixels.
//$height = Image height in pixels.
//$crop =true/false (crop images to specified width and height or resize).
$name = 'custom-size'; $width = '350px'; $height = '200px'; $crop = true;
add_image_size($name, $width, $height, $crop);

vérifiez ce lien https://developer.wordpress.org/reference/functions/add_image_size/. cette fonction écrit dans le fichier functions.php. vous pouvez maintenant utiliser cette image de taille personnalisée là où vous en avez besoin.

<?php if ( function_exists( 'wp_get_attachment_image_srcset' ) ) :?>
srcset="<?php echo esc_attr( wp_get_attachment_image_srcset( get_post_thumbnail_id( $blog_results->post->ID, 'custom-size' ) ) ); ?>"
sizes="<?php  echo esc_attr(wp_get_attachment_image_sizes( get_post_thumbnail_id( $blog_results->post->ID, 'custom-size' ) ) ); ?>"
<?php endif; ?>

maintenant vous pouvez obtenir l’image de votre désir.

Solution n°3 trouvée

Pour moi, cela fonctionne pour une taille personnalisée :

add_image_size( 'custom_size', 350, 350 ); // here I add custom image size

// https://stackoverflow.com/a/45507581/3829187
function create_responsive_image( $img ) {
    $img_id = attachment_url_to_postid( $img );
    $img_srcset = wp_get_attachment_image_srcset( $img_id );
    $img_sizes = wp_get_attachment_image_sizes( $img_id, 'custom_size' ); // and here I use custom image size
    return '<img src="' . $img . '" srcset="' . esc_attr( $img_srcset ) . '" sizes="' . esc_attr( $img_sizes ) . '">';
}

Ou si vous ne souhaitez pas créer de taille d’image personnalisée, vous pouvez utiliser d’autres tailles d’image WP par défaut : « vignette », « moyenne », « grande », « complète ». La valeur par défaut est ‘moyen’ 300px

function create_responsive_image( $img ) {
    $img_id = attachment_url_to_postid( $img );
    $img_srcset = wp_get_attachment_image_srcset( $img_id );
    $img_sizes = wp_get_attachment_image_sizes( $img_id, 'full' ); // for full size for example
    return '<img src="' . $img . '" srcset="' . esc_attr( $img_srcset ) . '" sizes="' . esc_attr( $img_sizes ) . '">';
}