Discussion :

[WPlover]

Bonjour,

Mon objectif est d’afficher les images à la une des publications d’un CPT au sein d’une taxonomy.

J’aimerai que cet affichage se fasse en miniature et qu’il utilise l’attribut srcset.

J’utilise ACF pour créer mon champs image en utilisant le Format dans le modèle “Données de l’image (tableau)”.

Voici le code que j’utilise sur taxonomy-mataxo.php:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
<?php if ( have_posts() ) : ?>
 
<?php while ( have_posts() ) : the_post(); ?>
 
<?php $image = get_field('image_1'); ?>
 
<img class="photoid" src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
 
<?php endwhile; ?>
 
<?php endif; ?>

J’obtiens l’affichage des images mais bien évidemment sans parvenir à utiliser un affichage au format ‘medium’ et sans le précieux attribut srcset (indispensable pour le LazyLoad…enfin je crois)

Je crois comprendre que je dois tout d’abords dans ACF utiliser un autre Format dans le modèle qui serait “ID de l‘image”

Mais pour le coup mon code ne fonctionne plus du tout !

Y’a t’il un retour d’expérience sur le sujet ?

[mathieu]

il y a une fonction wordpress qui construit automatiquement la liste "srcset" avec les images qui ont les mêmes proportions que le format demandé.

essayez ce code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
<?php
$image = get_field('image_1');
echo wp_get_attachment_image($image["id"], "thumbnail");
?>

[WPlover]

Génial un grand merci à toi mathieu

Ca marche super bien en conservant dans ACF le Format dans le modèle “Données de l’image (tableau)”.

J'obtiens parfaitement le format ciblé et l'attribut srcset.

Par contre j'ai bien loading="lazy" mais je ne vois pas de lazyload à l'affichage => J'utilise a3 Lazy Load. Je dois peut être vérifier tout le paramétrage.

Autre chose, pour le SEO, le nom de mon image devient : nom-image-300x300.jpg => Dans l'idéal je souhaiterai conserver nom-image.jpg.

Et voici deux questions bonus

[mathieu]

Par contre j'ai bien loading="lazy" mais je ne vois pas de lazyload à l'affichage => J'utilise a3 Lazy Load. Je dois peut être vérifier tout le paramétrage.

je ne connais pas cette extension, mais si l'attribut "srcset" est bien là, c'est le navigateur qui gère le chargement, il n'y a pas besoin d'extension pour cela.

Autre chose, pour le SEO, le nom de mon image devient : nom-image-300x300.jpg => Dans l'idéal je souhaiterai conserver nom-image.jpg.

je pense que c'est plutôt une question à poser dans le forum "référencement" :
https://www.developpez.net/forums/f7...referencement/

[WPlover]

Merci encore Mathieu pour les pistes => je mets en résolu !