Utiliser Elementor avec WP Rocket

Ce document contient des conseils sur la façon d'utiliser Elementor et WP Rocket sur votre site web.

Elementor et Reporter l'exécution JavaScript

Si vous remarquez que l'option Reporter l'exécution JavaScript interrompt ou même retarde le chargement de certains modules Elementor, vous pouvez cocher les cases correspondantes dans la section Exclusions en un clic, comme montré ci-dessous :

Le fait de cocher les cases et d'enregistrer les modifications devrait suffire à résoudre les problèmes de mise en page et à charger les éléments immédiatement.

Toutefois, si le problème persiste, il se peut que vous deviez trouver des exclusions personnalisées et les ajouter à la liste des fichiers JavaScript exclus.
Dans Elementor Editor v4+, le script inline ElementorInteractionsConfigajouté pour gérer les effets interaction peut empêcher l'option Reporter l'exécution JavaScript de fonctionner comme il se doit. Pour résoudre ce problème, veuillez suivre les instructions fournies ici.

Effet Sticky de Elementor

Dans certains cas, l'option Chargement différé des fichiers JavaScript peut casser l'effet sticky d'Elementor, empêchant les éléments de rester fixes à l'écran pendant le défilement.

Si cela se produit sur votre site, essayez de définir les éléments suivants dans la zone d'exclusion du Chargement différé des fichiers JavaScript :

/jquery-?[0-9.](.*)(.min|.slim|.slim.min)?.js
/jquery-migrate(.min)?.js
/elementor-pro/assets/lib/sticky/jquery.sticky.min.js

Si cette option est activée, les mêmes exclusions doivent être ajoutées à l'option Reporter l'exécution JavaScript.

L'éditeur de Elementor ne se charge pas

Dans certains cas, les ressources des serveurs ne sont pas suffisantes pour traiter les optimisations de WP Rocket et les modifications faites dans Elementor en même temps.

Cela peut conduire à ce que l'éditeur d'Elementor ne se charge pas, et affiche une page blanche à la place.

Augmenter la mémoire de PHP comme indiqué ici devrait résoudre ce problème.

Les fichiers post CSS d'Elementor ne seront pas minifiés

Les fichiers CSS des posts Elementor sont automatiquement exclus de la Minification CSS afin d'éviter que le cache ne soit vidé trop fréquemment.

Fonctionnalités de performances et expériences d'Elementor

Les fonctionnalités suivantes, disponibles dans Elementor > Réglages > Performance, doivent être désactivées :

Chargement optimisé des images
Chargement différé des images d’arrière-plan
Cache d'élément

Cela s’explique par les raisons suivantes :

WP Rocket inclut déjà les fonctionnalités de LazyLoad pour les images et de LazyLoad pour les images background CSS.
La fonctionnalité Optimiser les images critiques de WP Rocket ne prend pas encore en charge l’exclusion des images critiques du lazy loading tiers.
Le Cache d'élément peut entraîner l'affichage d'un contenu incorrect dans les widgets. Vous pouvez le désactiver, car WP Rocket gère la mise en cache de pages entières.

Soyez prudent lorsque vous utilisez les fonctionnalités Expériences et veillez à les tester après leur activation.

Purge synchronisée du cache

Les actions suivantes dans Elementor déclencheront l'effacement partiel ou total du cache de WP Rocket :

La Méthode d’impression CSS d'Elementor est réglée sur Fichier externe, et que la Mise en cache des éléments est réglée sur Défaut ou Actif.
Mise à jour d'un article ou d'une page à partir de l'éditeur Elementor.
Le mode de maintenance d'Elementor est modifié