Installation - Mise à jour

Installation, Mise à Jour

Installation - Mise à jour

Suivez les instructions de ce tutoriel afin d'installer / mettre à jour votre pack. Le tutoriel s'applique peu importe le pack possédé.

I - Installation

Connectez-sur votre espace client afin de télécharger le .zip de votre thème sur le drive en question :

 Attention : Il ne faut pas télécharger le dossier mais bien le fichier .zip comme le montre l'image ci-dessus. Voici le chemin d'accès avec l'exemple ci-dessus : "Pack Master + > Versions du Pack Master + > 1.04.1 > Phantom Thème Master + 1.04.1.zip". Veuillez à toujours télécharger la dernière version du thème !

Rendez-vous sur la section Thèmes de votre boutique Shopify puis faites défiler la page jusqu'à la partie Bibliothèque des thèmes.

Enfin, cliquez sur le bouton Mettre en ligne le thème.

Glisser votre pack Phantom Thème téléchargé au préalable dans la partie prévue à cet effet, puis cliquez sur Télécharger un fichier.

Après un temps d'attente, Shopify installera le thème et vous pourrez ainsi débuter la Personnalisation de celui-ci.

 

Attention : Si tu passes d'u thème à un autre, il ne faut surtout pas copier tes paramètres de ton ancien thème sur le Phantom Thème. Qui dit nouveau thème dis nouvelle personnalisation !

 

II - Mise à Jour

Lors de mise à jour, le transfert de votre personnalisation / traductions ne peut être fait automatiquement. Vous aurez donc à le faire manuellement.

Après avoir installé la mise à jour de votre thème (comme indiqué dans le tutoriel d'installation ci-dessus), suivez les étapes ci-dessous.

1 - Transfert des scripts d'applications ajoutés manuellement

Passez cette étape si vous n'avez aucun script rajouté manuellement dans votre précédente version (Facebook Ads, Google Search Console, Google Ads, etc...).

Rendez-vous dans l'ancienne version du thème sur Action > Modifier le code.

Dans la barre de recherche, notifiez theme.liquid, puis cliquez sur le fichier apparent. Copiez alors les balises que vous aviez rajouté manuellement entre les balises <head></head> de votre fichier.

Rendez-vous ensuite dans la Personnalisation de votre mise à jour du Thème, puis dans Paramètres de Thème > Extensions. Ici vous trouverez 3 emplacements :

  • Balise Head : Permet d'ajouter des scripts dans la partie <head> de votre thème. 
  • Css <head> : Permet d'ajouter des lignes de codes scss dans la partie <head> de votre thème
  • Balise <body> : Permet d'ajouter des scripts dans la <body> de votre thème

Tout ajout se faisant dans ces emplacements est automatiquement sauvegarder dans la personnalisation de votre thème. Lors des prochaines mise à jour, vous n'aurez donc plus à refaire cette étape.

2 - Transfert des personnalisations

Rendez-vous dans le code de l'ancien thème en cliquant sur Actions > Modifier le code.

Dans la barre de recherche, saisissez settings_data.json, puis cliquez sur le fichier apparent.

Dans le fichier en question, sélectionnez l'intégralité du fichier en faisant Ctrl + A sur Pc, ou ⌘ + A sur Mac puis copier le tout en faisant Ctrl + C sur Pc, ou ⌘ + C sur Mac.

Rendez-vous ensuite dans le code de votre mise à jour du thème en cliquant sur Actions > Modifier le code de celle-ci.

Dans la barre de recherche, saisissez settings_data.json, puis cliquez sur le fichier apparent.

Dans le fichier en question, sélectionnez l'intégralité du fichier en faisant Ctrl + A sur Pc, ou ⌘ + A sur Mac puis coller le code précédemment copié en faisant Ctrl + V sur Pc, ou ⌘ + V sur Mac.

Ce fichier représente l'ensemble des paramètres de personnalisation que vous avez définit pour votre thème. Il est propre à votre personnalisation et donc votre boutique !

2.1 En cas d'erreur 

Si une erreur comme l'image ci-dessus se présente, suivez la procédure qui suit :

  • Ici l'erreur indiqué concerne le paramètre "ecartement_titre" qui ne possède pas une valeur enregistré correcte par rapport aux modifications apportées à ce paramètre lors de la mise à jour. 
  • Il vous suffira de cliquer n'importe où dans le code du fichier, puis de faire Ctrl + F sur Pc, ou ⌘ + F sur Mac, puis de noter dans la barre de recherche le nom du paramètre, ici "ecartement_titre".
  • Trouvez la/les ligne(s) correspondante(s), puis supprimez la/les ligne(s) complètement. Cela réinitialisera le(s) paramètre(s) avec la valeur par défaut, qui elle est correcte, et vous pourrez ensuite sauvegarder votre fichier. 
  • Répétez l'opération pour chaque paramètre en erreur

Pour plus de détails dans la procédure, veuillez vous référez aux différentes erreurs possibles et comment les résoudre ici.

 

3 - Transfert des Traductions de Langue

Suivant la langue utilisée, vous n'aurez pas le même fichier à trouver.

  • Français : fr.json
  • Anglais : en.default.json
  • Espagnol : es.json
  • Italien : it.json
  • Allemand : de.json

Rendez vous sur le site suivant : http://www.jsondiff.com/C'est un comparateur de fichier au format .json, qui permettra ici de comparer les différences les traductions de l'ancien thème et de sa mise à jour.

3.1 - Remplacer ses propres traductions dans la mise à jour

Pour cela, rendez-vous dans le fichier de votre traduction suivant votre langue (énoncé ci-dessus) , en cliquant sur Actions > Modifier le code de l'ancien thème.

Dans la barre de recherche, saisissez alors le fichier correspondant à votre langue, puis cliquez dessus. 

Dans le fichier en question, sélectionnez l'intégralité du fichier en faisant Ctrl + A sur Pc, ou ⌘ + A sur Mac puis copier le tout en faisant Ctrl + C sur Pc, ou ⌘ + C sur Mac.

Coller ensuite le code précédemment copié en faisant Ctrl + V sur Pc, ou ⌘ + V sur Mac sur le site énoncé plus haut dans l'emplacement de gauche, comme ceci :

Rendez-vous dans le fichier de votre traduction suivant votre langue (énoncé ci-dessus) , en cliquant sur Actions > Modifier le code de la mise à jour du thème.

Dans la barre de recherche, saisissez alors le fichier correspondant à votre langue, puis cliquez dessus. 

Dans le fichier en question, sélectionnez l'intégralité du fichier en faisant Ctrl + A sur Pc, ou ⌘ + A sur Mac puis copier le tout en faisant Ctrl + C sur Pc, ou ⌘ + C sur Mac.

Coller ensuite le code précédemment copié en faisant Ctrl + V sur Pc, ou ⌘ + V sur Mac sur le site énoncé plus haut dans l'emplacement de droite, comme ceci :

Cliquez ensuite sur Compare. Vous aurez à l'écran vos deux fichier côte à côte à faire défiler. Lors du défilement, si vous repérez certaines lignes en bleu, ce sont soit vos traductions personnelles de l'ancien thème, soit des traductions rajoutées dans la mise à jour dues à de nouvelles fonctionnalités ou applications.

Vous allez ainsi repérez les n° de ligne auxquelles les lignes bleus apparaissent, et vous aurez à faire un copier/coller des traductions personnelles de l'ancien thème vers le nouveau une par une.

3.2 - Rajouter ses propres traductions de l'ancien thème vers la mise à jour

Il faut savoir qu'à chaque mise à jour (à partir de la 1.03), j'indiquerai si des lignes de traductions ont été rajoutés, et si c'est le cas, le n° de ligne, de manière à ce que vous puissiez les rajouter manuellement dans votre fichier de langue de votre ancien thème. Par la suite vous n'aurez plus qu'à copier/coller le contenu entier de ce fichier de l'ancien vers le nouveau thème.

Si vous avez des questions, n'hésitez pas à les poser sur notre Discord ou par email.