Pods tips : Lazy load avec WP Rocket
On ne présente plus le plugin de cache WP Rocket (enfin si ne le connaissait pas, c’est par ici)…
Il y a quelques temps, j’ai eu des soucis avec Pods et le lazy load de WP Rocket, mais, avec le concours des support des 2 plugins, l’explication et la résolution du problème a vite été trouvé 🙂
Comme je l’ai déjà dit, avec Pods, quelques fois « on sort des clous » de WordPress, ce n’est pas propre à ce plugin, cela peut être le cas dès qu’on code en PHP dans un thème…
WP Rocket, comme tout bon plugin, utilise des « hook » (des fonctions qui se greffent à des fonctions de WordPress), en l’occurrence the_post_thumbnail(), mais en dehors d’un post, cette fonction ne donne aucun résultat.
La solution est alors, de faire le lazy load « à la main »:
<?php $img = wp_get_attachment_image_src( $pods->field( 'photo.ID' ), 'full' ); ?> <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" data-lazy-original="<?php echo $img[0];?>" alt="<?php echo $pods->field( 'name' );?>" width=<?php echo $img[1];?> height=<?php echo $img[2];?>>
« photo » est le nom de votre champs image, « full » est la taille originale, pour plus de détails sur la fonction wp_get_attachment_image_src.
A noter que si vous utiliser des templates ou un champs WYSIWYG, Pods utilise alors la fameuse fonction the_post_thumbnail() , du coup, plus aucun problème de lazy load 🙂