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

Publié par Jean-Michel le

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.

Lire également:  Ajouter une fonctionnalité de légende au thème WordPress personnalisé

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.

Lire également:  Thème enfant Wordpress pour la deuxième installation

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 ) . '">';
}
Catégories : Wordpress

Jean-Michel

Jean-Michel est en charge de la partie blog du site. Il met en place la stratégie de contenu et répond aux questions fréquentes sur Wordpress.

0 commentaire

Laisser un commentaire

Avatar placeholder

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *