Shopify est un outil permettant de créer facilement une boutique en ligne pour les néophytes.
En revanche lorsqu’il est question de développement, les choses se corsent car cet outil pour boutique ecommerce est basé sur un modèle SaaS ce qui signifie que tout est hébergé sur un serveur distant dont vous n’aurez pas la main. Il existe un éditeur de code intégré à Shopify mais il peut être plus confortable de passer par votre IDE préféré pour développer votre propre code. Nous allons içi voir comment récupérer les fichiers de votre template et comment les synchroniser avec le serveur distant.
Note: Si votre environnement de développement est basé sur linux ou MacOS, je vous conseille d’aller directement sur les liens à la fin de cet article qui explique les différentes marche à suivre selon votre système d’exploitation.
Récupérer les informations
La première chose que je vous conseille de faire avant de se plonger dans les installations est de récupérer les identifiants de votre boutique & thème.
Dans le panneau admin de votre boutique, nous allons récupérer l’identifiant du template actuel.
Dans Online Store > Themes > … > Edit HTML/CSS, récupérez le numéro à la fin de l’URL, il se présentera sous cette forme : 123456789 et gardez le.
Ensuite, vous irez dans Apps (en bas gauche) > Manage private apps (c’est un lien tout en bas de la liste). Faites Generate API credentials puis renseignez les deux champs. Ensuite dans la liste, mettez « Theme templates and theme assets » sur « Read and write » et sauvegardez cela. Sur la page suivante, vous pouvez récupérer les deux données qui nous intéresse : API key et Password.
Installer Themekit et le configurer
Téléchargez le bon zip (32/64bits) sur cette page : themekit pour windows
Pour installer Themekit, voici la marche à suivre :
- Copiez le theme.exe du zip dans C:\Program Files\Theme Kit
- Clic droit sur Ordinateur ou Ce PC > Propriété > Paramètres système avancés > Variables d’environnement
- Dans la seconde fenêtre, recherchez une variable nomée Path, double cliquez dessus
- Ajoutez un nouveau chemin. C:\Program Files\Theme Kit en l’occurence dans notre exemple et enregistrez tout.
Si vous voulez vérifier que tout fonctionne normalement. Ouvrez l’invite de commande windows en tant qu’administrateur, écrivez theme et vous verrez que l’invite de commande vous donne l’aide pour les options.
Je vous conseil de créer un dossier du nom de votre boutique Shopify ( par exemple dans C:\Program Files\Theme Kit\theme ) et aller grâce à l’invite de commande ( avec la commande cd ) dans ce dossier Ensuite, rentrez cette ligne :
theme configure --password=0a1b2c3d4e5f6a7b8c9d0e1f2a3b4c5 --store=monadresse.myshopify.com --themeid=123456789
En remplaçant password et themeid précédemment récupérés dans votre template, ainsi que l’adresse de votre boutique. Cette commande permet de créer de fichier de configuration.
Pour télécharger les fichier du thème, lancez la commande :
theme download
Voilà, normalement les fichiers de votre template se téléchargent dans votre dossier.
Uploader les fichiers
Une fois que tous les fichiers sont téléchargés, vous voudrez sans doute faire des modifications et les uploader . Dans ce cas là, il faudra lancer la commande :
theme watch
Dès qu’un fichier sera modifié dans votre dossier, il sera automatiquement synchronisé avec le serveur distant de votre boutique Shopify.
Petit conseil afin d’automatiser la synchronisation vos fichiers sans relancer l’invite de commande à chaque fois. Créez un fichier avec l’extension .bat avec les deux lignes ci-dessous. Vous pourrez le lancer à chaque fois que vous développez votre thème.
cd "C:\Program Files\Theme Kit\chemin_de_vos_fichiers_shopify"
theme watch
Bon développement !
Source en anglais:
Top, merci pour cet article simple et concis en Français 😉