Hiérarchie des interfaces/thèmes et fallback

Structure d'un thème

Décomposition du thème

Magento 2 est fourni en standard avec les thèmes Blank et Luma. Nous partirons en général du thème Blank lors de la création d'un thème personnalisé afin d'avoir le moins de "pollution" possible.

Nous hériterons du thème Luma si le thème souhaité est moins personnalisé et qu'il s'en rapproche donc.

Les thèmes que nous créerons seront situés dans app/design/frontend Nous créerons en premier lieu le dossier de notre interface que nous appelerons ici Vendor. Ce dossier contiendra l'ensemble des thèmes de cette interface.

Une interface contient plusieurs thèmes : celui par défaut, Noël, les soldes etc.

Le fallback de Magento en résumé

Quand Magento essaie de trouver un fichier du thème, il cherche dans :

Vendor/theme
Vendor/default
interface_parent/theme_parent

Ce comportement permet de modifier uniquement les fichiers nécessaires à la personnalisation de notre thème.

Lors de nos formations sur Magento 1, nous alertions nos élèves sur le fait de ne pas modifier les thèmes de base de Magento (base/default ou rwd/default par exemple). Cet avertissement n'a plus lieu d'être avec Composer, les fichiers de vendor n'étant pas commités.

TP : Modifier le header

Plan du TP

Objectif : Afficher un texte dans le header

Création d'un thème : https://devdocs.magento.com/guides/v2.3/frontend-dev-guide/themes/theme-create.html. Étendre le thème Luma.
Appliquer notre thème dans le back-office : Content > Design > Configuration
Vérifier que le front est toujours bon, malgré notre thème vide.
Dans un premier temps, activer le debuggeur pour savoir où se situe le fichier du header
Copier/coller ce fichier dans notre thème et le modifier. Attention à bien reprendre le nom du module, le chemin du fichier sera donc app/design/frontend/Vendor/default/Magento_XXX/templates/...