Désactivez le LazyLoad sur des images spécifiques
Vous trouverez un champ dans les réglages du plugin pour exclure les images et les iframes du LazyLoad :
Pour exclure une image, vous pouvez utiliser n'importe quel mot-clé du nom de fichier de l'image, de sa classe CSS ou du nom de domaine (pour les images hébergées en externe).
Exemple
Si vous souhaitez exclure l'image suivante :
<img src="http://www.example.org/wp-content/uploads/daniele-riggi-635135-unsplash.jpg" class="attachment-full size-full" />
Vous pouvez utiliser l'un des éléments suivants :
daniele-riggi-635135-unsplash.jpg
attachment-full size-full
- cela exclura toutes les images avec ces deux classesattachment-full
ousize-full
- cela exclura les images avec l'une ou l'autre classe spécifique-unsplash
- cela exclura également toute autre image avec-unsplash
dans le nom de fichier
Désactiver le LazyLoad sur une image
Si vous voulez désactiver le LazyLoad sur une image en particulier, c’est simple.
Vous pouvez le faire en ajoutant :
- soit l’attribut
data-skip-lazy
- soit la class
skip-lazy
à la balise HTML img
:
<img src="my-image.jpg" data-skip-lazy="" alt="" width="100" width="100" />
<img src="my-image.jpg" class="skip-lazy" alt="" width="100" width="100" />
Ceux-ci ne sont sont disponibles qu'à partir de la version 3.5 de WP Rocket et font partie d'une coopération entre les auteurs de plugins des solutions LazyLoad pour normaliser les exclusions. Cela signifie que si vous passez d'un plugin coopérant à l'autre et que vous utilisez l'une de ces méthodes d'exclusion, celle-ci s'appliquera toujours dans la solution alternative.
Si vous utilisiez data-no-lazy
, cela fonctionnera toujours, mais pour WP Rocket seulement.
Désactiver le LazyLoad sur une class image
Vous pouvez aussi cibler une class spécifique à exclure du LazyLoad en utilisant ceci :
function rocket_lazyload_exclude_class( $attributes ) { $attributes[] = 'class="divi-slider"'; return $attributes; } add_filter( 'rocket_lazyload_excluded_attributes', 'rocket_lazyload_exclude_class' );
Dans $attributes
, la class doit être rigoureusement identique au markup HTML. Par example si la class attribuée à l'image est la suivante :
class="attachment-post-thumbnail size-post-thumbnail wp-post-image"
Vous devez spécifier tout les attributs, comme ceci :
$attributes[] = 'class="attachment-post-thumbnail size-post-thumbnail wp-post-image"';
Désactiver le LazyLoad par source d'image
Vous pouvez aussi cibler une image en fonction de sa src
, permettant ainsi d'exclure des images hébergées sur d'autres domaines du LazyLoad. Dans l'exemple ci-dessous, les images servies par wp.com seront exclues du LazyLoad :
function rocket_lazyload_exclude_src( $src ) { $src[] = 'wp.com'; return $src; } add_filter( 'rocket_lazyload_excluded_src', 'rocket_lazyload_exclude_src' );
Désactiver le Lazyload sur les avatars
Si vous souhaitez désactiver le Lazyload sur tous les avatars de votre site web, vous pouvez le faire en ajoutant ce code dans le fichier functions.php
de votre thème, par exemple.
remove_filter( 'get_avatar', 'rocket_lazyload_images', PHP_INT_MAX );