Comment désactiver correctement le chargement différé dans WordPress (étape par étape)

Le chargement différé aide généralement votre site Web à se charger plus rapidement en retardant le chargement des images jusqu'à ce qu'un utilisateur fasse défiler la page pour les voir. Cependant, cela peut parfois causer des problèmes d'affichage, faire apparaître votre contenu « au-dessus du pli » plus lentement, ou entrer en conflit avec la mise en page de votre thème.

Nous constatons souvent que cela se produit sur les portfolios de photographie où les images de haute qualité doivent se charger immédiatement. Si cette fonctionnalité nuit à votre expérience utilisateur, vous devez trouver un moyen de la désactiver.

Chez WPBeginner, nous avons aidé des milliers d'utilisateurs à résoudre les problèmes d'images en toute sécurité. Nous savons exactement quelles méthodes fonctionnent le mieux sans casser votre site.

Dans cet article, nous vous montrerons comment désactiver correctement le chargement différé dans WordPress.

Qu'est-ce que le chargement différé ?

WordPress a introduit pour la première fois le chargement différé des images dans WordPress 5.5. Plus tard, il a étendu la fonctionnalité de chargement différé aux intégrations iframe (comme les vidéos YouTube, Spotify et autres intégrations).

Cette pratique permet d'améliorer les performances de votre site et la vitesse de chargement des pages en chargeant rapidement le contenu de la zone visible en premier.

Un site web plus rapide n'est pas seulement bon pour les utilisateurs, mais il peut aussi améliorer le classement de votre site web car les moteurs de recherche comme Google considèrent la vitesse comme un facteur de classement important.

En dehors des images et des intégrations, vous pouvez également facilement charger les commentaires en différé et les Gravatars pour améliorer encore la vitesse de chargement des pages.

Vous pouvez voir la fonctionnalité de chargement différé en action en faisant un clic droit sur une image et en sélectionnant l'outil Inspecter dans votre navigateur.

Cela divisera l'écran de votre navigateur et vous montrera le code source HTML. De là, vous pourrez voir l'attribut « loading=lazy » ajouté à l'image.

Normalement, nous ne recommandons pas de désactiver le chargement différé en raison de ses avantages globaux pour votre site Web WordPress. Le désactiver peut entraîner une vitesse de site Web plus lente, des taux de conversion plus faibles et des classements SEO plus bas.

Cependant, le chargement différé peut nuire à l'expérience utilisateur de certains sites Web.

Par exemple, si vous gérez un site Web de photographie où les images sont l'aspect le plus important de votre contenu, alors les charger en différé peut ruiner l'expérience utilisateur de vos clients.

Dans d'autres cas, vous utilisez peut-être un plugin de performance autonome (comme WP Rocket) qui a sa propre solution de chargement différé, vous voudrez donc désactiver le chargement différé par défaut de WordPress pour éviter les conflits.

Cela dit, voyons comment vous pouvez facilement désactiver le chargement différé dans WordPress.

Pour ce tutoriel, nous vous montrerons une méthode par code et une méthode par plugin. Vous pouvez utiliser les liens ci-dessous pour accéder à l'option de votre choix :

• Méthode 1 : Désactiver le chargement différé dans WordPress avec WPCode (recommandé)
• Méthode 2 : Désactiver le chargement différé dans WordPress avec un plugin
• Tutoriel vidéo
• Bonus : Améliorez la vitesse et les performances de votre site
• Foire aux questions sur la désactivation du chargement différé
• Ressources supplémentaires

Méthode 1 : Désactiver le chargement différé dans WordPress avec WPCode (recommandé)

Vous pouvez désactiver la fonctionnalité de chargement différé dans WordPress en ajoutant du code personnalisé au fichier functions.php de votre thème.

Cependant, gardez à l'esprit que la moindre erreur lors de l'ajout du code peut casser votre site Web et le rendre inaccessible.

C'est pourquoi nous recommandons d'utiliser WPCode pour ajouter du code personnalisé. Il dispose d'une protection intégrée contre les erreurs pour empêcher le mauvais code de casser votre site.

C'est le meilleur plugin de snippets de code personnalisé pour WordPress sur le marché. De plus, il rend l'ajout de code à votre site Web super facile et sûr.

Nous l'avons testé minutieusement sur notre site de démonstration et avons obtenu d'excellents résultats. Pour en savoir plus, consultez notre avis complet sur WPCode.

Tout d'abord, vous devez installer et activer le plugin WPCode. Pour des instructions détaillées, consultez notre guide sur comment installer un plugin WordPress.

Après l'activation, visitez la page Extraits de code » + Ajouter un extrait depuis le tableau de bord WordPress.

À partir de là, cliquez sur le bouton « Utiliser le snippet » sous l'option « Ajouter votre code personnalisé (Nouveau snippet) ».

Cela vous redirigera vers la page « Créer un extrait personnalisé », où vous pourrez commencer par taper un nom pour votre extrait de code.

Cela peut être n'importe quoi qui vous aidera à identifier le snippet de code et ce qu'il fait. Nous avons appelé le nôtre « Désactiver le chargement différé ».

Une fois que vous avez donné un nom à votre snippet personnalisé, sélectionnez « Snippet PHP » dans le menu déroulant « Type de code » dans le coin droit de l'écran.

Maintenant, copiez et collez le code PHP suivant dans la boîte « Aperçu du code » :

// Disable native WordPress lazy loading 
add_filter( 'wp_lazy_loading_enabled', '__return_false' );

Voici à quoi ressemblera le code après avoir été collé.

Après cela, faites défiler jusqu'à la section « Insertion ». Ici, choisissez simplement le mode « Insertion automatique ».

Cela garantira que votre code personnalisé sera automatiquement exécuté partout sur votre site WordPress une fois que vous aurez activé le snippet.

Ensuite, faites défiler jusqu'en haut de la page et basculez simplement le commutateur « Inactif » sur « Actif ».

Enfin, n'oubliez pas de cliquer sur le bouton « Enregistrer le snippet » pour enregistrer et exécuter votre snippet de code.

Désormais, le chargement différé par défaut sera désactivé sur votre site WordPress.

Avant de tester, assurez-vous de vider votre cache de navigateur et le cache WordPress. Ensuite, vous pouvez faire un clic droit sur une image et sélectionner « Inspecter » dans le menu du navigateur.

Vous pouvez tester cela en faisant un clic droit sur une image et en sélectionnant « Inspecter » dans le menu du navigateur.

Dans le code HTML de l'image, l'attribut « loading=lazy » disparaîtra maintenant.

Méthode 2 : Désactiver le chargement différé dans WordPress avec un plugin

Si vous ne souhaitez pas ajouter de code à votre site, vous pouvez utiliser un plugin pour désactiver le chargement différé de WordPress.

La seule chose que vous avez à faire est d'installer et d'activer le plugin Disable Lazy Load . Pour plus d'instructions, consultez notre guide étape par étape sur comment installer un plugin WordPress.

Le plugin fonctionne dès sa sortie de la boîte et ne nécessite aucune configuration. Une fois activé, il désactivera automatiquement la fonctionnalité de chargement différé par défaut sur votre site Web.

Tutoriel vidéo

Si vous ne préférez pas les instructions écrites, vous pouvez regarder notre tutoriel vidéo :

Bonus : Améliorez la vitesse et les performances de votre site

Une fois que vous avez désactivé le chargement différé, cela peut affecter négativement la vitesse et les performances de votre site web.

Dans ce cas, vous pouvez essayer d'autres astuces pour améliorer les performances de votre site et réduire le temps de chargement des pages. Par exemple, vous pouvez optimiser les images de votre site en les compressant, en utilisant JPEG ou PNG comme formats de fichier, et plus encore.

De plus, vous devriez toujours utiliser la dernière version de WordPress, utiliser des extraits sur la page d'accueil, diviser les commentaires en pages et utiliser des thèmes optimisés pour le SEO sur votre site web.

En dehors de cela, vous pouvez également utiliser des plugins de mise en cache comme WP Rocket ou WP Super Cache pour améliorer encore la vitesse de votre site.

Pour plus de conseils, vous pouvez consulter notre guide pour débutants sur la façon de booster la vitesse et les performances de WordPress.

Foire aux questions sur la désactivation du chargement différé

Nous recevons souvent des questions de nos lecteurs sur la façon dont le chargement différé affecte les performances du site Web et quand il doit être désactivé. Voici les réponses à certaines des questions les plus courantes.

1. La désactivation du chargement différé nuira-t-elle à mon classement SEO ?

La désactivation globale du chargement différé peut ralentir votre site Web car toutes les images se chargeront en même temps. La vitesse de page étant un facteur de classement pour Google, un site plus lent pourrait avoir un impact négatif sur votre SEO.

Cependant, la désactivation du chargement différé pour votre image principale (Largest Contentful Paint) peut en fait améliorer vos scores Core Web Vitals.

2. Puis-je désactiver le chargement différé pour des images spécifiques uniquement ?

Oui, vous pouvez désactiver le chargement différé pour des images spécifiques (comme votre logo ou l'image d'en-tête). Pour ce faire, vous pouvez ajouter manuellement l'attribut loading="eager".

Dans l'éditeur de contenu WordPress, sélectionnez simplement le bloc Image, cliquez sur le menu à trois points dans la barre d'outils et sélectionnez « Modifier en HTML » pour ajouter l'attribut.

Cela indique au navigateur de charger cette image spécifique immédiatement tout en laissant le chargement différé actif pour le reste du site WordPress.

3. WordPress charge-t-il les images d'arrière-plan en différé ?

Non, la fonctionnalité de chargement différé par défaut de WordPress ne s'applique qu'aux images dans les balises <img> et aux iframes. Les images ajoutées comme éléments d'arrière-plan à l'aide de CSS ne sont pas chargées de manière différée par le logiciel WordPress de base.

4. Est-il préférable d'utiliser un plugin ou du code pour désactiver le chargement différé ?

Si vous êtes à l'aise avec le collage d'extraits, l'utilisation de WPCode est la meilleure méthode car elle maintient votre site léger. Cependant, si vous souhaitez une solution rapide sans configurer de paramètres, le plugin Disable Lazy Load est un choix sûr et efficace pour les débutants.

Ressources supplémentaires

Nous espérons que cet article vous a aidé à apprendre comment désactiver correctement le chargement différé dans WordPress. Vous voudrez peut-être aussi consulter ces ressources supplémentaires :

• Comment optimiser les images pour les performances Web (étape par étape)
• Le guide ultime pour améliorer la vitesse et les performances de WordPress
• Comparatif des meilleurs plugins de compression d'images pour WordPress
• Comment corriger les problèmes d'images courants dans WordPress
• Guide pour débutants sur le SEO des images – Optimisez les images pour les moteurs de recherche

Si cet article vous a plu, abonnez-vous à notre chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.