Refonte du thème PrestaShop : un nouveau design sans casser les modules

Un nouveau thème PrestaShop garde vos modules quand trois inventaires précèdent le dessin : les hooks où les modules injectent leur HTML, les surcharges déjà posées et la version visée. Un thème qui n’appelle pas un hook n’affiche plus ce que les modules y accrochaient. Au 14 octobre 2026, Hummingbird 2.0 est le thème par défaut de PrestaShop 9.1, et Classic y est déprécié pour les nouveaux développements.

• Hummingbird 2.0 remplace Classic comme base d’un thème PrestaShop sur mesure
• Les modules injectent leur HTML dans le thème par des hooks
• Les surcharges de gabarits de modules ne suivent pas le changement de thème
• Un thème enfant limite la refonte à ce qui change
• La version visée fixe le cadre du thème avant le dessin
• L’activation d’un thème efface des réglages posés par le précédent
• Le thème fixe une part du poids chargé sur chaque page PrestaShop
• Les modules à raccorder aux hooks font varier le prix d’un thème
• Cinq livrables à exiger d’un prestataire de thème PrestaShop
• Sources consultées
• Foire aux questions

Hummingbird 2.0 remplace Classic comme base d’un thème PrestaShop sur mesure

Depuis le 23 mars 2026, PrestaShop 9.1 livre Hummingbird 2.0 à la place de Classic dans toutes les nouvelles installations. Hummingbird repose sur Bootstrap 5.3.3 et se passe de jQuery. Reprendre sur Hummingbird un thème écrit pour Bootstrap 4, comme Classic, demande de mettre à jour les noms de classes et les utilitaires.

Les modules injectent leur HTML dans le thème par des hooks

Un hook est un point d’extension : le module y accroche du contenu, le thème l’affiche en appelant le hook dans un gabarit. La page « Theme hooks » distingue les hooks d’affichage, comme displayFooter ou displayProductActions, qui produisent du HTML, et les hooks d’action, qui exécutent du code sans rien afficher.

Le gabarit appelle le hook par son nom. Il affiche le HTML renvoyé par tous les modules rattachés.

Sans cet appel, d’après cette description, l’avis clients, la barre de réassurance ou le module de livraison ne s’affichent plus.

Relevez avant tout travail la liste des modules par hook dans Apparence > Positions (Design > Positions dans la documentation anglaise). La page indique, pour chaque hook, le nombre de modules attachés et leur ordre d’affichage. Chaque ligne devient un point de recette : elle se retrouve à l’écran, ou son absence se décide.

Les surcharges de gabarits de modules ne suivent pas le changement de thème

Un thème modifie l’affichage d’un module sans toucher au module. Il place un fichier dans son dossier modules, en reproduisant l’arborescence du module : themes/mytheme/modules/ps_featuredproducts/views/templates/front/ps_featuredproducts.tpl, par exemple. PrestaShop utilise ce fichier à la place de celui du module.

Une surcharge posée dans l’ancien thème reste dans l’ancien thème. Elle se recopie dans le nouveau, puis se compare à la version actuelle du module, qui a pu changer.

La page « Overrides » décrit deux cas. Un gabarit qui inclut ses sous-gabarits par chemin relatif ignore leur surcharge. Surchargez chaque fichier inclus, ou demandez au développeur du module d’adopter le préfixe module:, qui fait chercher d’abord la surcharge du thème. Un fichier de surcharge vide ne rend rien, et le bloc disparaît de la page.

Pour un module de commande en une page, la surcharge conserve la structure du DOM (l’arbre des balises de la page) et les sélecteurs JavaScript dont le module a besoin. Le reste du parcours relève du tunnel de commande.

Décrire mon besoin →

Un thème enfant limite la refonte à ce qui change

Pour de petites modifications, un bloc ajouté ou un style ajusté, la page « Create a theme from Hummingbird » recommande un thème enfant. C’est un dossier avec un fichier config/theme.yml qui désigne le thème parent. Il hérite de tous les gabarits et styles du parent et ne contient que les fichiers modifiés.

Pour des changements profonds du balisage, la page « Child theme » recommande de partir de Hummingbird. Le thème devient une copie du code de Hummingbird, à maintenir ensuite ; le contrat dit par qui. Dans cette page, « sur mesure » désigne ce cas.

Un thème du commerce, acheté sur une place de marché, annonce dans theme.yml une version maximale testée, la clé to, que PrestaShop n’applique pas : seul un essai sur une copie de la boutique la confirme.

La version visée fixe le cadre du thème avant le dessin

Hummingbird est lié à des versions précises de PrestaShop, selon la page « Quick start » de la documentation. Une boutique en 8 qui prévoit la 9 vérifie d’abord la matrice de compatibilité de Hummingbird, publiée sur son dépôt. La migration de PrestaShop 8 vers 9 garde le thème en place, mais fait vérifier quatre pages avec lui.

L’annonce de la 9.1 décrit un outil de mise à jour (Update Assistant 7.6.0) qui détecte les modules incompatibles et les désinstalle automatiquement. Un module que le nouveau thème affiche peut être désinstallé pendant la montée de version : testez-la sur une copie, thème compris.

L’activation d’un thème efface des réglages posés par le précédent

À l’activation, PrestaShop applique le fichier theme.yml du nouveau thème. Tous les types d’images existants sont supprimés et remplacés par ceux du thème. Les réglages modules_to_hook et modules_to_unhook, qui rattachent ou détachent des modules, ne s’appliquent eux aussi qu’à ce moment : modifiés sur un thème déjà actif, ils restent sans effet.

Trois précautions en découlent. Exportez le thème actuel (« Exporter ce thème », dans Apparence > Thème et logo ; Design > Theme & Logo, « Export current theme », dans la documentation anglaise). Notez les types d’images dont vos modules se servent. Gardez l’ordre des modules relevé dans Apparence > Positions. Le bouton « Utiliser ce thème » (« Use this theme ») remplace le thème actuel pour tous les visiteurs.

Le thème fixe une part du poids chargé sur chaque page PrestaShop

Le thème déclare ses feuilles de style et ses scripts : leur priorité, leur position (en-tête ou bas de page), un attribut async ou defer (chargement sans bloquer l’affichage). Au 1er août 2026, parmi les sites PrestaShop mesurés dans le monde par HTTP Archive, la page médiane pesait 2,82 Mo sur mobile, dont 1,21 Mo d’images et 0,84 Mo de JavaScript.

Le réglage core_scripts, mis à la valeur false, désactive core.js. Il supprime alors le système d’événements « prestashop » et jQuery, dont dépendent la plupart des modules. La page « Optimize your PrestaShop » signale aussi que des modules accrochés à trop de pages, surtout critiques, peuvent ralentir la boutique.

Décrire mon besoin →

Les modules à raccorder aux hooks font varier le prix d’un thème

Le prix suit le nombre de modules à raccorder aux hooks et le nombre de gabarits à reprendre. Il suit aussi la base choisie : thème enfant, copie de Hummingbird ou thème du commerce. Les tests sur navigateurs et téléphones et la préproduction pèsent aussi. La page « Validation » de la documentation exige déjà 28 gabarits, dont 13 pour le compte client, de customer/address à customer/registration. Un module sur mesure ajoute un cas à chaque hook où il apparaît.

Faites écrire que le prestataire corrige à ses frais l’affichage d’un module cassé par le nouveau thème. Le parcours sur téléphone se cadre dans sa propre mission.

Cinq livrables à exiger d’un prestataire de thème PrestaShop

• l’inventaire des hooks et des modules rattachés, avant et après ;
• la liste des surcharges de modules recopiées ou abandonnées, avec la raison ;
• le code source, dans un dépôt dont vous êtes propriétaire, avec theme.yml renseigné (display_name, version, meta.compatibility.from) ;
• le thème exporté au format Zip, l’ancien conservé ;
• le compte rendu des tests que la page « Browser compatibility » demande : Chrome, Firefox, Safari et Edge sur ordinateur, Safari sur iOS et Chrome sur Android.

Le message du formulaire de cette page gagne à nommer le thème actif et son origine, la version de PrestaShop et le nombre de modules installés.

Sources consultées

• PrestaShop, documentation développeur de PrestaShop 9, « Themes », « Child theme », « Create a theme from Hummingbird », « Theme hooks » et « Overrides », consulté le 14 octobre 2026.
• PrestaShop, documentation développeur de PrestaShop 9, « Theme structure », « Asset management », « Validation », « Quick start » et « Browser compatibility », consulté le 14 octobre 2026.
• PrestaShop, documentation développeur de PrestaShop 9, « Optimize your PrestaShop », consulté le 14 octobre 2026.
• PrestaShop, « PrestaShop 9.1 is now available », consulté le 14 octobre 2026.
• PrestaShop, « Hummingbird v2.0.0 Beta », consulté le 14 octobre 2026.
• PrestaShop, guide utilisateur de la version 8 en français, « Positions des modules » et « Thème et logo », consulté le 14 octobre 2026.
• PrestaShop, guide utilisateur de la version 8, « Informations de configuration » en français, « Theme and Logo », « Positions » et « Information » en anglais, consulté le 14 octobre 2026.
• HTTP Archive, relevé « page-weight » de la technologie PrestaShop au 1er août 2026, consulté le 14 octobre 2026.

Foire aux questions

Un thème acheté sur une place de marché convient-il à une refonte ?

Oui, à condition de le tester. Seule une copie de la boutique montre si vos modules s’affichent, quelle que soit la version annoncée par le vendeur. Placez vos retouches dans un thème enfant, que le guide utilisateur de la version 8 décrit comme le moyen de conserver les mises à jour du thème parent sans perdre vos modifications.

Peut-on tester le nouveau thème sans que les visiteurs le voient ?

Pas sur la boutique ouverte, où l’activation décrite plus haut vaut pour tous les visiteurs. L’essai se fait sur une copie de la boutique, avec ses modules et ses données. Contrôlez-y l’affichage avant de reproduire la bascule en production.

Un module de personnalisation du thème remplace-t-il une refonte ?

Non. Le guide utilisateur de la version 8 précise que le module « Personnalisation de thème » ne fonctionne qu’avec le thème par défaut de PrestaShop (Classic dans cette version) et les modules intégrés. Sur un thème sur mesure, il ne s’applique pas : la reprise des hooks et des surcharges reste à faire.

Classic reste-t-il utilisable ?

Oui, comme thème existant. La page « Themes » de la documentation de PrestaShop 9 le déprécie pour les nouveaux développements depuis la 9.1 et le laisse disponible pour la compatibilité ascendante. Les pages lues ne donnent pas de date de retrait. Un thème enfant qui en dépend peut rester en place, sans être la base recommandée d’un nouveau thème.

À qui appartient le code d’un thème sur mesure ?

Cela se décide au contrat, pas dans PrestaShop. La documentation recommande, pour un nouveau thème, de cloner le dépôt de Hummingbird. Faites écrire à qui reviennent les droits, où se trouve le dépôt et comment le code vous est remis.