Modifier le code du thème

Liens en vedette

1. Répertoire des partenaires Shopify
2. Documentation Shopify sur la structure des thèmes et leur extension
3. Documentation destinée aux développeurs Shopify sur Liquid
4. Documentation Shopify sur la duplication des thèmes
5. Documentation Shopify sur l’assistance pour les thèmes
6. Documentation Shopify sur l’importation d’images de thème
7. Thèmes dans l’interface administrateur Shopify
8. Documentation Shopify sur les versions des thèmes
9. Documentation Shopify sur la personnalisation des thèmes
10. Documentation Shopify sur la recherche d’assistance pour votre thème

Vidéos utiles

Vidéo de la Shopify Academy : personnaliser votre boutique

Vidéo de la Shopify Academy : personnaliser votre boutique

Modifier le code du thème Align

La modification du code vous permet d’apporter des changements détaillés à votre boutique en ligne Align sur Shopify. Les fichiers de thème peuvent contenir du Liquid, du HTML, du CSS, du JSON et du JavaScript.

Ne modifiez le code que si vous êtes à l’aise avec le HTML et le CSS et que vous avez des connaissances de base en Liquid. Utilisez l’éditeur de thème Align lorsqu’il permet d’effectuer le changement souhaité.

Attention

Les mises à jour du thème peuvent supprimer les changements de code incompatibles avec la copie mise à jour. Conservez une sauvegarde avant de commencer.

Pour obtenir de l’aide concernant les questions spécifiques à Align, commencez par contacter l’assistance Company XYZ. Si vous avez besoin d’une fonctionnalité personnalisée et que vous n’avez pas d’expérience en HTML, CSS et JavaScript, l’assistance Company XYZ peut vous aider à déterminer l’étape suivante appropriée.

Avant de personnaliser Align

Effectuez les étapes suivantes avant de modifier le code :

1. Dupliquez votre thème pour créer une sauvegarde.

   Vous pouvez supprimer les changements et recommencer à partir de cette copie si nécessaire.

2. Consultez le niveau d’assistance disponible pour votre thème.

3. Prenez connaissance des exigences et des bonnes pratiques pour importer des images

Modifier le code de votre thème

1. Dans votre interface administrateur Shopify, accédez à Online Store > Themes

2. Repérez la copie du thème Align que vous souhaitez modifier, cliquez sur … > Edit code.

3. Sélectionnez un fichier dans le répertoire à gauche pour l’ouvrir dans l’éditeur.

4. Apportez vos modifications. Vous pouvez ouvrir et modifier plusieurs fichiers à la fois.

   Les fichiers modifiés affichent un point à côté de leur nom, ce qui vous permet de suivre les fichiers dans lesquels vous avez apporté des changements.

Revenir à une version antérieure du thème

Si vous devez annuler une modification, vous pouvez rétablir des fichiers .liquid individuels à une version enregistrée antérieure.

Les fichiers du dossier Assets, notamment theme.scss.liquid et theme.js, ne conservent pas les versions précédemment modifiées. Conservez une copie séparée des changements apportés à ces fichiers si vous risquez d’avoir besoin de les récupérer.

1. Dans votre interface administrateur Shopify, accédez à Online Store > Themes

2. Repérez la copie du thème Align que vous souhaitez modifier, cliquez sur … pour ouvrir le menu des actions, puis sélectionnez Edit code.

3. Sous Templates, sélectionnez un fichier .liquid récemment modifié.

4. Sélectionnez Current version sous le nom du fichier.

5. Utilisez le menu déroulant pour choisir une version antérieure.

   La sélection d’une date et d’une heure restaure la version enregistrée correspondante.

6. Facultatif : sélectionnez Preview store pour confirmer que le problème est résolu.

Utiliser Theme Check

Theme Check fournit des commentaires immédiats pendant que vous écrivez du code, afin de vous permettre d’identifier les problèmes avant qu’ils n’affectent votre boutique en ligne Align.

Il peut identifier des problèmes tels que :

• Les scripts qui bloquent l’analyse et peuvent ralentir une boutique en ligne.
• Les incohérences dans les fichiers de traduction, notamment les clés de traduction manquantes ou les traductions qui ne correspondent pas à un fichier de paramètres régionaux.
• Les modèles manquants.

Une ligne rouge apparaît sous le code lorsqu’une erreur est identifiée. Survolez la ligne mise en évidence pour afficher ses détails.

Trouver des tutoriels sur la personnalisation des thèmes

Les tutoriels sur la personnalisation du code du thème peuvent vous guider dans les changements à apporter à des pages ou fonctionnalités spécifiques. Choisissez des tutoriels qui correspondent à la version de l’architecture de votre thème ; découvrez comment identifier la version de l’architecture de votre thème

1. Personnalisation des thèmes Online Store 2.0

Obtenir de l’aide pour les personnalisations

Pour obtenir des conseils spécifiques à Align, contactez l’assistance Company XYZ. Company XYZ prend en charge Align et peut vous aider à comprendre les options liées au thème avant que vous n’effectuiez des modifications.

Les ressources d’assistance Shopify expliquent également où trouver de l’assistance pour votre thème et des ressources supplémentaires sur l’assistance pour les thèmes. Utilisez l’assistance Shopify pour les questions relatives à l’interface administrateur Shopify, au compte, à la facturation ou à d’autres éléments gérés par la plateforme.

Notes d’utilisation

1. Travaillez à partir d’une sauvegarde. Dupliquez votre thème Align avant chaque session de personnalisation du code.
2. Utilisez le bon outil. Privilégiez l’éditeur de thème lorsqu’il permet d’obtenir le résultat souhaité sans modifier le code.
3. Vérifiez les changements. Prévisualisez la boutique après avoir modifié ou restauré un fichier afin de confirmer que le résultat attendu est obtenu.
4. Modifiez les ressources avec précaution. Conservez votre propre copie des changements apportés aux fichiers du dossier Assets, car les versions précédemment modifiées n’y sont pas disponibles.