WordPress – Image sélectionnée

Publié par Jean-Michel le

J’essaie d’optimiser mon site qui utilise Featured Image. Lorsque je me tourne vers certains des outils d’analyse, ils m’indiquent que je charge des images beaucoup plus grandes que nécessaire pour les vignettes.

En effet, WordPress utilise la même URL pour l’image en taille réelle et la vignette. Le résultat est que WordPress télécharge la grande image deux fois, puis réduit la taille pour s’adapter à la vignette.

Y at-il de toute façon autour de cela? Par exemple, existe-t-il un moyen de mettre une URL différente pour la vignette qui pointe vers un fichier image plus petit ?

Merci

Solution n°1 trouvée

Tout d’abord, il ne s’agit pas de WordPress, mais du thème que vous utilisez. Par défaut WordPress fonctionne comme ceci :

<?php
  if ( has_post_thumbnail() ) {
    the_post_thumbnail("full")
  }
?>

renverra quelque chose comme ceci:

<img width="1500" height="1276" src="path" class="post-img-full wp-post-image" alt="" srcset="path 1500w, path-300x255.jpg 300w, path-768x653.jpg 768w, path-1024x871.jpg 1024w, path-1080x919.jpg 1080w" sizes="(max-width: 1500px) 100vw, 1500px">

ce qui est tout à fait juste et moderne. Et vous pouvez voir qu’il utilise des chemins différents non seulement pour chaque miniature, mais qu’il modifie l’image en fonction de la largeur de l’écran. Ici, ‘Path’ devrait être le vrai chemin

Solution n°2 trouvée

Ajoutez d’abord une nouvelle taille pour l’image en vedette dans functions.php

 if ( function_exists( 'add_image_size' ) ) {
    add_image_size( 'special', 250, 150,true );
}

La deuxième étape de l’image en vedette de l’appel

<?php $img = wp_get_attachment_url( get_post_thumbnail_id($post->ID),'special' ); ?>

<img src="<?php echo $img ?>" />

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 *