Table of Contents

• 1. Copiez le thème par défaut
• 2. Modifier les feuilles de styles
  • Astuces de l‘équipe de développement de PrestaShop
• 3. Créer une copie d‘écran en avant-première
• 4. Testez votre thème
• Partagez vos thèmes!

---

N’importe qui ayant une connaissance des CSS et dans la manipulation d’images peut créer un nouveau thème pour PrestaShop.

Astuces: Nous recommandons l’utilisation du plugin de Firefox Firebug pour de simples comparaison et débogage entre vos CSS et l’output.

Suivez les étapes ci-dessous pour créer un nouveau thème pour PrestaShop.

1. Copiez le thème par défaut

1. Localisez le répertoire ../themes et créez une copie par défaut du répertoire ../themes/prestashop/.
2. Renommez la copie.

2. Modifier les feuilles de styles

1. Dans le nouveau dossier (par exemple, ../themes/MyStoreTheme/), repérer le répertoire /css.
2. Ouvrez le fichier global.css and modifiez-le selon vos besoins.
   Note: le fichier maintenance.css positionné dans le même répertoire contrôle la mise en page en mode maintenance.
3. Les nouvelles images ou les images modifiées doivent être placées dans un nouveau répertoire /img (par exemple, ../themes/MyStoreTheme/img).

Astuces de l‘équipe de développement de PrestaShop

• Si possible, privilégiez les CSS au lieu du HTML (par exemple, pour les onglets)
• Validez votre code XHTML code sur w3c.org
• Réduisez la taille des images et des photos en les compressant
• Testez votre thème plusieurs navigateurs
• Gardez les noms de fichiers des bas-de-casse
• le texte et le logo de la page d’accueil sont modifiables directement via le Back Office. Allez dans le Back Office >> Modules >> Editeur de page d’accueil et cliquez sur Configurer.
• Changez le positionnement des modules sur une ou plusieurs pages en les greffant via le Back Office:
  1. Allez dans le Back Office >> Modules >> Positions
  2. Cliquez sur Greffer un module.
  3. Dans la première liste déroulant, sélectionnez le module que vous voulez déplacer.
  4. Dans la seconde liste déroulante, sélectionnez l’endroit où vous voulez greffer le module.
  5. Tapez le nom de ces fichiers pour lesquels le module ne sera pas affiché(facultatif).
  6. Cliquez sur Enregistrer.

3. Créer une copie d‘écran en avant-première

Quand votre thème est prêt, vous devez placer un fichier, représentant le thème, appelé preview.jpg dans le dossier racine du thème(par exemple, ../themes/MyStoreTheme). Ce fichier doit être en 100 × 100 pixels et en .jpg.

4. Testez votre thème

1. Allez dans le Back Office >> Préférences >> Apparence >> Dans la partie Thèmes
2. Sélectionnez le nouveau thème et cliquez sur Enregistrer.

Partagez vos thèmes!

Faites profiter la communauté de votre dur travail, recueillez les réactions et construisez-vous une réputation en partageant votre thème dans la partie Thèmes de votre Forum.