Problèmes d'affichage du site web après l'installation du certificat SSL

Résolution des erreurs de « mixed content » et des mises en page cassées après la migration HTTPS.

Après l'installation d'un certificat SSL, il arrive que la mise en page de votre site soit désorganisée, que des images soient manquantes ou que le navigateur affiche l'avertissement suivant : « La page tente de charger des scripts depuis des sources non authentifiées. »

Pourquoi cela se produit

La cause la plus fréquente est la présence de liens codés en dur utilisant le protocole http:// dans le code ou la base de données de votre site. Ce phénomène est connu sous le nom de Mixed Content (contenu mixte). Les navigateurs modernes bloquent le chargement des fichiers CSS, JavaScript et de polices non sécurisés sur une page HTTPS chiffrée afin de protéger les utilisateurs, ce qui finit par affecter l'apparence et les fonctionnalités du site.

Comment corriger les erreurs de contenu mixte

1. Mettre à jour les fichiers de configuration

De nombreux CMS (comme WordPress, Joomla ou OpenCart) stockent l'URL du site dans des fichiers de configuration spécifiques.

  • Localisez votre fichier de paramètres (par exemple, wp-config.php ou settings.php).
  • Recherchez toutes les occurrences de votre domaine et remplacez le protocole http:// par https://.

2. Effectuer une recherche et un remplacement en base de données

Si les liens non sécurisés sont stockés dans votre contenu ou vos métadonnées, une correction manuelle peut s'avérer impossible. Utilisez un outil comme PHPMyAdmin ou un plugin dédié pour effectuer une recherche et un remplacement global dans votre base de données.

  • Rechercher : http://yourdomain.com
  • Remplacer par : https://yourdomain.com

3. Utiliser des chemins relatifs

Pour éviter ce type de problème à l'avenir, adoptez des chemins relatifs plutôt que des URLs absolues dans vos templates et scripts :

  • Au lieu de : http://site.com/css/style.css
  • Utilisez : /css/style.css ou le chemin relatif au protocole //site.com/css/style.css.

Vérification

Une fois les modifications effectuées, vérifiez le résultat en suivant ces étapes :

  1. Vider le cache du navigateur : Sur votre site, appuyez sur Ctrl + F5 (Windows) ou Cmd + Shift + R (Mac) pour forcer le rechargement de la page.
  2. Vider le cache côté serveur : Si vous utilisez des plugins de mise en cache ou des outils côté serveur comme Memcached ou OPCache, assurez-vous de les vider également.
  3. Inspecter la console : Appuyez sur F12 pour ouvrir les Developer Tools et accédez à l'onglet Console. Toutes les ressources encore bloquées en raison de connexions non sécurisées y seront listées.

Aide

Une question ou besoin d'un coup de main ? Écrivez-nous via le système de tickets — nous sommes toujours là pour vous aider !

Besoin d’aide?Nos ingénieurs vous aideront gratuitement pour n’importe quelle question en quelques minutesNous contacter