DocumentationCommerceGuide de Commerce sur le cloud

[PaaS uniquement]{class="badge informative" title="S’applique uniquement aux projets Adobe Commerce on Cloud (infrastructure PaaS gérée par Adobe) et aux projets On-premise."}

Thème personnalisé

Last update: Fri Jan 31 2025 00:00:00 GMT+0000 (Coordinated Universal Time)

Créé pour :

  • Administration
  • Développeur

Vous pouvez installer un ou plusieurs thèmes à utiliser pour un ou tous vos magasins et sites dans votre projet. Les thèmes incluent plusieurs fichiers statiques, notamment des images, des polices, des fichiers CSS, JavaScript, PHP, etc. afin de concevoir entièrement vos magasins. Vous pouvez ajouter le thème en extrayant son code dans le système de fichiers ou à l’aide du compositeur.

Installer un thème manuellement

Pour installer un thème manuellement, vous devez disposer du code du thème dans une archive compressée ou dans une structure de répertoires similaire à ce qui suit :

<VendorName>
  ├── composer.json
      ├── etc
      │   └── view.xml
      ├── media
      ├── registration.php
      ├── theme.xml
      └── web
          ├── css
          │   └── source
          ├── fonts
          ├── images
          └── js

Pour installer un thème manuellement :

  1. Copiez le code du thème sous <Project root dir>/app/design/frontend pour un thème de storefront ou <Project root dir>/app/design/adminhtml pour un thème Admin. Vérifiez que le répertoire de niveau supérieur est <VendorName> ; sinon, le thème ne s’installe pas correctement.

    code language-bash 
    cp -r ExampleTheme <project-root>/app/design/frontend

  2. Confirmez que le thème a été copié au bon endroit.

    • Thème de Storefront : ls <project-root>/app/design/frontend
    • Thème administrateur : ls <project-root>/app/design/adminhtml

    Voici un exemple :

    ExempleThème Adobe Commerce

  3. Ajoutez et validez des fichiers.

    code language-bash 
    git add -A && git commit -m "Add theme"

  4. Envoyez les fichiers à votre branche.

    code language-bash 
    git push origin <branch name>

  5. Attendez la fin du déploiement.

  6. Connectez-vous à l’administrateur.

  7. Cliquez sur Contenu > Conception > Thèmes.

    Le thème s’affiche dans le volet de droite.

Installer un thème à l’aide du compositeur

L’installation d’un thème à l’aide du compositeur est identique à l’installation de toute autre extension utilisant le compositeur. Voir Installation, gestion et mise à niveau des modules pour plus d’informations.

Pour installer un thème à l’aide du compositeur :

  1. Achetez le thème auprès de Commerce Marketplace.

  2. Obtenez le nom du compositeur du thème.

  3. Dans votre répertoire racine Adobe Commerce, saisissez la commande :

    code language-bash 
    composer require <vendor>/<name>:<version>

    Par exemple,

    code language-bash 
    composer require zero1/theme-fashionista-theme:1.0.0

  4. Attendez que les dépendances soient mises à jour.

  5. Saisissez les commandes suivantes :

    code language-bash 
    git add -A && git commit -m "Add theme"
    code language-bash 
    git push origin <branch name>

  6. Connectez-vous à l’administrateur.

  7. Cliquez sur Contenu > Conception > Thèmes.

    Le thème s’affiche dans le volet de droite.

Plusieurs thèmes

Lorsque vous utilisez plusieurs thèmes, par exemple différents thèmes par paramètre régional, passez en revue la variable d’environnement SCD_MATRIX pour personnaliser le déploiement du thème. Voir les étapes création ou déploiement dans la configuration de l’environnement.

recommendation-more-help
7c2b03ac-000c-497d-aba3-2c6dc720a938