Appliquer manuellement le LazyLoad à une image

WP Rocket applique automatiquement le LazyLoad aux images qui sont ajoutées via l'éditeur, ou appelées depuis les fonctions natives de WordPress comme the_post_thumbnail().

Mais certains thèmes/extensions utilisent leurs propres fonctions personnalisées que nous ne pouvons pas détecter. Il y a deux manières d’ajouter manuellement LazyLoad aux images que WP Rocket ne détecte pas :

Editer le HTML de la balise image

Editez le HTML de la balise image elle-même avec le src et data-lazy-src, comme suit :

<img src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201%201'%3E%3C/svg%3E" data-lazy-src="http://example.com/image.jpg" alt="" width="600" height="400" />

Editer le modèle de page PHP

Ajoutez-la au fichier modèle de page PHP :

<?php
$image = get_field( 'image' );

if( ! empty( $image )
	&& function_exists( 'get_rocket_option' )
	&& get_rocket_option( 'lazyload' )
	&& ! ( defined( 'DONOTROCKETOPTIMIZE' ) && DONOTROCKETOPTIMIZE )
) : ?>
	<img src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201%201'%3E%3C/svg%3E" data-lazy-src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
<?php elseif( ! empty( $image ) ) : ?>
	<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
<?php endif; ?>