Pourquoi la mise en page du back-office PrestaShop apparaît-elle déstructurée, avec des blocs mal alignés ou du CSS manquant ?

Un dirigeant qui ouvre son back-office PrestaShop et découvre des menus qui se chevauchent, des boutons sans style, des colonnes qui débordent ou des icônes manquantes se demande légitimement si la boutique est compromise. Dans l'immense majorité des cas, il ne s'agit pas d'un piratage mais d'un problème de chargement des feuilles de style (CSS) ou des scripts (JS) qui habillent l'interface d'administration. Ce type d'incident est fréquent après une mise à jour, l'installation d'un module, ou un changement d'hébergement. Voici comment identifier la cause précise et la corriger sans tout casser.

Vérifier en premier le cache CSS/JS de PrestaShop

PrestaShop combine et compresse automatiquement les fichiers CSS et JavaScript pour accélérer le chargement des pages, back-office compris. Ce mécanisme de cache peut rester bloqué sur une version obsolète après une mise à jour de module ou de thème, provoquant un affichage cassé.

• Accéder à Paramètres avancés > Performances dans le menu back-office.
• Repérer la section « Optimisation CSS/JS » ou « Combine/Compress/Cache ».
• Désactiver temporairement l'option de compression CSS et JS, enregistrer, puis recharger la page.
• Vider le cache via le bouton dédié si disponible, ou supprimer manuellement le contenu du dossier var/cache en FTP (sans toucher aux autres fichiers).

Si l'affichage redevient correct après cette manipulation, le problème venait bien d'un cache corrompu. Il faut alors réactiver la compression progressivement et surveiller si le souci revient après la prochaine mise à jour.

Identifier un conflit de module ou de surcharge de thème

Un module mal codé peut injecter du CSS ou du JS qui entre en conflit avec les styles natifs du back-office. C'est particulièrement fréquent avec des modules tiers installés en dehors de l'Addons officiel, ou avec des modules qui n'ont pas été mis à jour depuis plusieurs versions majeures de PrestaShop.

• Lister les modules installés récemment : Modules > Gestionnaire de modules, trier par date d'installation.
• Désactiver un à un les modules suspects (pas les désinstaller, juste désactiver) en commençant par les plus récents.
• Recharger le back-office après chaque désactivation pour voir si l'affichage se corrige.
• Vérifier aussi les overrides dans le dossier override/ et les surcharges de thème dans admin/themes/ qui peuvent modifier l'interface d'administration elle-même.

Un exemple fréquent : un module de export comptable ou de connecteur marketplace ajoute sa propre bibliothèque CSS en l'appliquant globalement au lieu de la limiter à sa page de configuration. Résultat, tout le back-office hérite de styles non prévus.

Contrôler les ressources statiques et les permissions fichiers

Si les fichiers CSS ou JS ne se chargent pas du tout (erreur 403 ou 404 visible dans la console du navigateur), le problème est souvent lié aux droits d'accès ou à un déplacement de fichiers lors d'une migration d'hébergement.

• Ouvrir la console développeur du navigateur (touche F12), onglet « Réseau » ou « Network », et recharger la page du back-office.
• Repérer les ressources en erreur : fichiers .css ou .js renvoyant un code 403, 404 ou 500.
• Vérifier les permissions des dossiers admin/themes, js/ et css/ : généralement 755 pour les dossiers et 644 pour les fichiers sur un hébergement mutualisé classique.
• Confirmer que le chemin de l'admin n'a pas été modifié sans mise à jour de la configuration (certains hébergeurs renomment le dossier admin lors d'une migration).

Sur un hébergement avec CDN actif, il arrive aussi que les anciennes versions de fichiers CSS restent servies en cache côté CDN alors que le code source a changé côté serveur. Il faut alors purger le cache CDN en plus du cache PrestaShop.

Vérifier la compatibilité navigateur et les extensions

Avant de suspecter un bug serveur, un test rapide permet d'écarter une cause locale : ouvrir le back-office en navigation privée, sans extensions de navigateur actives, et idéalement sur un autre navigateur (Chrome, Firefox, Edge).

• Tester en navigation privée pour exclure un cache navigateur obsolète.
• Désactiver les extensions de type bloqueur de publicité ou VPN qui peuvent interférer avec le chargement de certaines ressources.
• Forcer un rechargement complet avec Ctrl+F5 (ou Cmd+Maj+R sur Mac) pour ignorer le cache local du navigateur.

Si le problème disparaît sur un autre poste ou navigateur, la correction se limite à vider le cache local de chaque utilisateur concerné, sans intervention serveur.

Cas particulier après une migration de version

Une mise à jour de PrestaShop (par exemple de la 1.6 vers la 8, ou entre versions mineures de la 8.x) peut laisser des fichiers CSS ou JS obsolètes issus de l'ancienne version si la mise à jour n'a pas été complète. Le thème d'administration change parfois de structure entre versions majeures.

• Vérifier la version exacte de PrestaShop installée dans Paramètres avancés > Informations.
• Comparer avec la documentation officielle sur devdocs.prestashop-project.org pour confirmer que tous les fichiers du thème admin ont bien été mis à jour.
• Relancer l'étape de mise à jour via le module de mise à jour officiel si une migration a été interrompue.

Ce scénario est plus technique et justifie souvent l'intervention d'un prestataire si la migration n'a pas été menée avec une sauvegarde complète au préalable.

Quand solliciter un prestataire PrestaShop

Si le vidage de cache, la désactivation de modules et la vérification des permissions ne suffisent pas à rétablir un affichage normal, le problème peut venir d'un conflit plus profond entre le code du thème, une surcharge mal implémentée, ou une incompatibilité PHP (certaines versions de PHP génèrent des erreurs silencieuses qui cassent le rendu). Un diagnostic par un développeur PrestaShop expérimenté, avec accès aux logs d'erreurs et à la console navigateur, permet généralement de trancher en moins d'une heure.

Performeer PrestaShop met en relation les dirigeants de boutiques avec des prestataires PrestaShop qualifiés, de façon neutre et sans engagement, pour ce type de diagnostic technique comme pour des interventions plus larges de maintenance ou d'évolution.