Personnaliser un thème PrestaShop sans casser les mises à jour
Le scénario le plus fréquent : un thème modifié directement, qui fonctionne parfaitement... jusqu'à la première mise à jour de PrestaShop, qui écrase silencieusement tout le travail de personnalisation. Il existe une méthode qui évite ce piège.
Trois façons de personnaliser, du plus sûr au plus risqué
Le bon réflexe est de commencer par le premier niveau, et de ne descendre au suivant que si c'est vraiment nécessaire.
Les hooks
Points d'ancrage prévus par PrestaShop pour insérer du contenu ou un module sans toucher au thème. La solution la plus sûre, à vérifier systématiquement avant de surcharger un template.
Le thème enfant
Hérite automatiquement du thème parent (Classic ou un thème premium). Seuls les fichiers modifiés sont stockés à part ; le reste continue de suivre les mises à jour du parent.
La modification directe
À éviter sauf cas très ponctuel : chaque mise à jour du thème d'origine écrase les fichiers modifiés, sans avertissement.
La structure minimale d'un thème enfant
Quelques fichiers suffisent pour hériter proprement d'un thème existant.
| Fichier / dossier | Rôle |
|---|---|
| theme.yml | Déclare le thème parent et configure l'héritage des ressources CSS/JS |
| preview.png | Vignette 250×250 px affichée dans le back-office |
| /assets/css/ | Feuilles de style additionnelles, chargées après celles du parent |
| /templates/ | Uniquement les fichiers Smarty/Twig réellement surchargés — jamais une copie complète du thème parent |
Bon réflexe, mauvais réflexe
Bonnes pratiques
- Vérifier l'existence d'un hook avant de surcharger un template
- Ne copier dans le thème enfant que les fichiers réellement modifiés
- Ajouter le CSS personnalisé dans un fichier séparé, chargé après le parent
- Vider le cache Smarty après chaque modification de template
- Tester la personnalisation sur un environnement de recette avant la mise en production
Erreurs fréquentes
- Modifier directement les fichiers du thème parent
- Copier l'intégralité du thème parent dans le thème enfant (annule l'héritage)
- Empiler les
!importanten CSS plutôt que comprendre la cascade - Oublier de vider le cache, qui continue de servir l'ancienne version
- Une erreur de syntaxe dans le fichier YAML, qui bloque silencieusement le thème enfant
Ce qui change avec PrestaShop 9 et Hummingbird
Le nouveau thème par défaut de PrestaShop 9.1 modifie légèrement l'approche de personnalisation.
@layer CSS pour une priorisation explicite des styles et une convention de nommage BEM, plutôt que l'approche SASS du thème Classic. La logique de thème enfant reste valable, mais la façon d'écrire vos surcharges CSS évolue. Voir notre guide de migration vers PrestaShop 9 pour le contexte complet.