Si vous utilisez Elementor pour créer votre site, dont votre header et votre footer, il vous est peut-être déjà arrivé de constater que, de temps en temps, leur mise en page se casse. Un peu comme ceci :
C’est un bug assez récurent, et, Dieu merci, facile à corriger avec les deux solutions que je m’apprête à vous montrer.
La cause du problème
La cause du problème est toute simple : c’est le blocage de contenu mixte par votre navigateur qui va « casser » la mise en page de certains éléments de votre site.
Le contenu mixte survient lorsqu’une page web sécurisée (HTTPS) contient des éléments non sécurisés (HTTP).
Tout simplement !
Si nous cliquons sur « Désactiver la protection pour l’instant », le site s’affiche correctement.
Pour faire simple, Elementor va desservir certaines ressources en HTTP (pour une raison quelconque) et non en HTTPS. Votre navigateur, dans un souci de sécurité, ne chargera donc pas les ressources qui ne sont pas en HTTPS.
Solution 1 (temporaire) – Régénérer les ressources via Elementor
Pour corriger ce souci, du moins temporairement, il suffit de régénérer les ressources et fichiers via les paramètres d’Elementor, comme suit :
1. Se rendre dans l’onglet « Outils » d’Elementor.
2. Puis cliquer sur « Régénérer les fichiers et les données ».
Cette astuce, bien qu’elle fonctionne, ne règlera pas le souci une bonne fois pour toute. Vos mises en page se verront à nouveau cassées dans quelque temps.
Donc voici la solution définitive.
Solution 2 (définitive) – Forcer la redirection HTTPS
Pour palier à ce souci pour toujours, il suffit de forcer la redirection HTTPS sur votre site. Pour ce faire, c’est très simple, et ça se tient en une petite ligne dans votre fichier .htaccess (accessible via votre FTP) :
RewriteEngine On RewriteCond %{HTTPS} off RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]Et voilà ! C’est terminé. Vous n’aurez plus ce genre de soucis sur vos sites construits avec Elementor ! 😉
