Modification du code de thème

Cette page a été imprimée le Dec 04, 2023. Pour la dernière version, allez à https://help.shopify.com/fr/manual/online-store/themes/theme-structure/extend/edit-theme-code.

Vous pouvez modifier le code de votre thème pour apporter des modifications détaillées à votre boutique en ligne. La plupart des fichiers qui composent un thème contiennent des éléments Liquid, le langage de modélisation de Shopify. Les fichiers de thème contiennent également du langage HTML, CSS, JSON et JavaScript. Ne modifiez le code d'un thème que si vous possédez de l'expérience avec HTML et CSS, ainsi que des connaissances de base de Liquid.

Sur cette page

Avant de personnaliser votre thème

Pour vous préparer à personnaliser votre thème, effectuez les tâches recommandées suivantes :

Modifier le code de votre thème

Vous pouvez modifier le code de votre thème.

Étapes

  1. Dans l'interface administrateur Shopify, accédez à Boutique en ligne > Thèmes.
  2. Cliquez sur ... > Modifier le code.
  1. Dans l’application Shopify, appuyez sur le bouton …
  2. Dans la section Canaux de vente, appuyez sur Online Store (Boutique en ligne).
  3. Appuyez sur Manage themes (Gérer les thèmes).
  4. Cliquez sur ... > Modifier le code.
  1. Dans l’application Shopify, appuyez sur le bouton …
  2. Dans la section Canaux de vente, appuyez sur Online Store (Boutique en ligne).
  3. Appuyez sur Manage themes (Gérer les thèmes).
  4. Cliquez sur ... > Modifier le code.

L'éditeur de code affiche un répertoire des fichiers de thème sur la gauche, et un espace pour afficher et modifier les fichiers sur la droite.

Lorsque vous cliquez sur un fichier dans le répertoire de gauche, il s’ouvre dans l’éditeur de code. Vous pouvez ouvrir et modifier plusieurs fichiers à la fois. Tous les fichiers que vous modifiez afficheront un point à côté de leur nom :

Le répertoire des fichiers de thème montrant un point à côté des fichiers qui ont été modifiés

Cela peut vous aider à savoir où vous avez apporté des modifications.

Revenir à une ancienne version de votre thème

Si vous avez modifié des fichiers du thème et que vous devez les rétablir, vous pouvez revenir aux fichiers individuels .liquid précédant la date et l'heure auxquelles vous les avez modifiés.

Étapes

  1. Dans l'interface administrateur Shopify, accédez à Boutique en ligne > Thèmes.
  2. Recherchez le thème que vous souhaitez modifier, cliquez sur le bouton … pour ouvrir le menu Actions, puis cliquez sur Modifier le code.
  3. Sous l’en-tête Modèles, cliquez sur l’un des fichiers .liquid que vous avez récemment modifiés.
  4. Cliquez sur Version actuelle sous le nom de fichier .liquid.
  5. Cliquez sur le menu déroulant pour sélectionner une ancienne version. Si vous cliquez sur un horodateur, le code revient à la version enregistrée.
  6. Facultatif : cliquez sur Aperçu de la boutique pour vérifier que l’erreur a été corrigée.
  1. Dans l’application Shopify, appuyez sur le bouton …
  2. Dans la section Canaux de vente, appuyez sur Online Store (Boutique en ligne).
  3. Appuyez sur Manage themes (Gérer les thèmes).
  4. Recherchez le thème que vous souhaitez modifier, cliquez sur le bouton … pour ouvrir le menu Actions, puis cliquez sur Modifier le code.
  5. Sous l’en-tête Modèles, cliquez sur l’un des fichiers .liquid que vous avez récemment modifiés.
  6. Cliquez sur Version actuelle sous le nom de fichier .liquid.
  7. Cliquez sur le menu déroulant pour sélectionner une ancienne version. Si vous cliquez sur un horodateur, le code revient à la version enregistrée.
  8. Facultatif : cliquez sur Aperçu de la boutique pour vérifier que l’erreur a été corrigée.
  1. Dans l’application Shopify, appuyez sur le bouton …
  2. Dans la section Canaux de vente, appuyez sur Online Store (Boutique en ligne).
  3. Appuyez sur Manage themes (Gérer les thèmes).
  4. Recherchez le thème que vous souhaitez modifier, cliquez sur le bouton … pour ouvrir le menu Actions, puis cliquez sur Modifier le code.
  5. Sous l’en-tête Modèles, cliquez sur l’un des fichiers .liquid que vous avez récemment modifiés.
  6. Cliquez sur Version actuelle sous le nom de fichier .liquid.
  7. Cliquez sur le menu déroulant pour sélectionner une ancienne version. Si vous cliquez sur un horodateur, le code revient à la version enregistrée.
  8. Facultatif : cliquez sur Aperçu de la boutique pour vérifier que l’erreur a été corrigée.

Theme Check

L’éditeur de code inclut Theme Check, une fonctionnalité qui permet d’éviter les erreurs en fournissant un retour d’expérience immédiat pendant l’écriture du code, et non au moment de l’utilisation de votre thème.

Dans l’éditeur de code, Theme Check peut identifier les erreurs suivantes dans le code modifié :

  • Blocage des scripts par l’analyse, ce qui peut ralentir une boutique en ligne
  • Incohérences entre les fichiers de traduction, telles que des clés de traduction manquantes ou des traductions non concordantes dans un fichier de paramètres régionaux
  • Modèles manquants

Les erreurs sont signalées par une ligne rouge sous le code. Pour afficher l’erreur, survolez la ligne soulignée avec votre souris.

Exemple de détection d’une erreur de code par Theme Check

Tutoriels sur la personnalisation du code des thèmes

Vous pouvez suivre des tutoriels de personnalisation du code des thèmes pour vous aider à modifier votre boutique en ligne. Les tutoriels sont organisés en fonction du type de page ou de la fonctionnalité qu'ils modifient.

Les tutoriels de personnalisation de thème sont divisés par la version de l’architecture de thème qu’ils utilisent. Découvrez comment identifier la version de l’architecture de votre thème.

Obtenir de l'assistance pour les personnalisations

Si vous avez besoin d'aide pour apporter des modifications à votre thème, vous pouvez contacter le développeur de votre thème pour obtenir de l'assistance.

Pour voir les autres ressources disponibles pour vous aider à personnaliser les thèmes, voir Ressources supplémentaires pour le support des thèmes.

Prêt(e) à commencer à vendre avec Shopify ?

Essayez gratuitement