Prestashop : Comment créer un thème enfant ?

C'est quoi un thème enfant ?

Avant de savoir ce qu'est un thème enfant, il est important de rappeler la signification d'un thème dans PrestaShop.
Un thème dans PrestaShop va permettre d'habiller et d'apporter du style à votre site. C'est un ensemble de fichier qui va définir l'apparence de votre boutique.

Un thème enfant va tout simplement (comme son nom l'indique) hériter de son thème parent. Ce qui va lui permettre de reprendre sa configuration et ses fichiers assets (css, js, img...)

A quoi ça sert ?

Le premier avantage d'utiliser un thème enfant est la scalabilité. La capacité qu'a votre thème à "survivre" aux mises à jour.

On sait tous comment PrestaShop (et pleins d'autres logiciels) sont sensibles aux upgrades de version. On a toujours peur que quelque chose se passe mal et de devoir revenir en arrière. Or, il est important de faire des mises à jour, surtout en ce moment. Le problème c'est que par défaut, quand vous mettez à jour un thème sur PrestaShop, tous les fichiers sont écrasés par les nouveaux, et vous perdez toutes vos modifications.

Le fait de mettre en place un thème enfant va permettre d'isoler toutes les modifications que vous avez à faire sur votre site et de garder l'habillage par défaut dans le thème parent. Ainsi, quand vous aurait besoin de mettre en jour le thème, vous mettrez à jour uniquement le thème parent et les modifications que vous avez faites ne seront pas impactées.

Le deuxième avantage est l'organisation de votre code. Qui fera la joie des développeurs.

Comme je l'ai dit précédemment, quand on utilise un thème enfant on se retrouve avec un thème qui regroupe les fonctionnalités de base (parent) et un autre autre qui comporte uniquement les modifications spécifiques que l'on a apportées au site (enfant). De ce fait, on sait d'un coup d'œil ce qui a été modifié, et cela fait gagner du temps précieux aux développeurs. Cela peut être très pratique également si plusieurs personnes travaillent en même temps sur le projet.

Comment créer un thème enfant ?

Voici les différentes étapes à faire pour créer un thème enfant :

  • Dans votre projet PrestaShop, créer un dossier theme_enfant dans le dossier /themes.
  • Récupérez dans le thème parent l’image de pré-visu preview.png et copier la dans le thème enfant.
  • A l’intérieur du dossier theme_enfant, créez un sous-dossier config.
  • Dans ce sous dossier config, créez un fichier theme.yml.
  • Copier le code suivant dans ce fichier :

parent: classic

name: theme_enfant

display-name: Thème enfant

version: 1.0.0

assets:

   use_parent_assets: true

Détail des lignes :

  • parent: Nom du thème parents (reprendre exactement le nom du dossier)
  • name: Nom du thème enfant (reprendre exactement le nom du dossier)
  • display-name: Nom qui sera affiché dans la liste des thèmes en BackOffice
  • version : Versiondu thème
  • use_parent_assets: Mettre à true pour que votre thème enfant hérite des assets

Il ne vous reste plus qu'à activer votre thème enfant dans le BackOffice :

Tutoriel en vidéo

Retrouvez également le tutoriel en vidéo en cliquant ici