Récupération d'un thème Shopify vers GitHub

Guide pour récupérer un thème Shopify directement depuis une boutique (avec toutes les modifications faites en live via l'éditeur/personnalisateur) et le mettre à jour sur notre repository GitHub.

Contexte

Il arrive qu'un thème soit modifié directement sur une boutique Shopify (via le personnalisateur de thème, l'éditeur de code en ligne, ou par un tiers) sans que ces changements ne soient reportés dans notre repo Git. Avant de reprendre le développement localement, il faut donc récupérer l'état actuel du thème sur la boutique et le synchroniser avec GitHub, afin de ne perdre aucune modification.

Prérequis

• Shopify CLI installé
• Accès à la boutique Shopify concernée (droits développeur / collaborateur)
• Accès en écriture au repository GitHub du thème
• Le repository cloné en local (ou à cloner si ce n'est pas déjà fait)

# Installer Shopify CLI si besoin
npm install -g @shopify/cli @shopify/theme

Étape 0 : Créer le repository GitHub (si le thème n'en a pas encore)

Si la boutique n'a jamais été suivie en Git, il faut d'abord créer le repository sur GitHub avant de pouvoir y récupérer le thème.

1. Créer le repo dans l'organisation Moon-Moon-team

   • Aller sur github.com/organizations/Moon-Moon-team/repositories/new (opens in a new tab)
   • Nom du repo : convention nom-boutique-shopify (ou le nom déjà utilisé pour les autres projets du client)
   • Visibilité : Private
   • Ne pas initialiser avec un README, un .gitignore ou une licence à cette étape : le premier contenu du repo sera le thème récupéré depuis la boutique, pas un template vide (un repo initialisé avec des fichiers créerait un historique divergent au premier push)

2. Donner les accès nécessaires

   • Ajouter les développeur(se)s concerné(e)s comme collaborateurs (ou via l'équipe existante si le repo hérite des permissions d'un Team GitHub)
   • Vérifier que la personne qui va faire la récupération a bien un accès en écriture

3. Cloner le repo vide en local

   git clone https://github.com/Moon-Moon-team/NOM-DU-REPO.git
   cd NOM-DU-REPO

4. Ajouter un .gitignore adapté aux thèmes Shopify (optionnel mais recommandé)

   Avant de récupérer le thème, on peut committer un .gitignore de base pour éviter de versionner des fichiers inutiles (fichiers de config Shopify CLI locaux, fichiers système, etc.). Le repo étant vide juste après le clone, il faut d'abord créer ce fichier (il n'existe pas encore) :

   cat > .gitignore << 'EOF'
   .shopify/
   .DS_Store
   node_modules/
   EOF

   Puis le committer :

   git add .gitignore
   git commit -m "Ajout du .gitignore initial"
   git push -u origin main

⚠️ Cette étape ne concerne que la création initiale du repo. Si le repo existe déjà (cas le plus courant), passer directement à l'étape 1.

Étape 1 : Se connecter à la boutique

⚠️ Les versions actuelles du Shopify CLI (3.x) n'ont plus de commande theme login séparée : elle a été supprimée. L'authentification se déclenche automatiquement (ouverture du navigateur pour se connecter) dès qu'on lance une commande theme en précisant --store, par exemple directement avec shopify theme list --store=VOTRE-BOUTIQUE.myshopify.com à l'étape 2.

Il n'y a donc rien à exécuter à cette étape en tant que telle : il suffit de connaître l'URL .myshopify.com de la boutique (le domaine d'origine, pas le nom de domaine personnalisé du client), qui sera utilisée dans toutes les commandes suivantes.

Comment récupérer ce lien :

• Depuis l'admin Shopify : une fois connecté à l'admin de la boutique, l'URL de l'admin est de la forme https://admin.shopify.com/store/NOM-BOUTIQUE. Le nom NOM-BOUTIQUE correspond au sous-domaine à utiliser : NOM-BOUTIQUE.myshopify.com
• Depuis les réglages de la boutique : dans l'admin, aller dans Réglages > Domaines, le domaine myshopify.com par défaut y est listé (même si un domaine personnalisé est configuré en principal)
• Si vous n'avez pas encore accès à l'admin, demander ce lien directement au client ou à la personne ayant créé la boutique

Il n'y a pas de commande dédiée pour "juste" se connecter au préalable (shopify auth login n'accepte pas de flag --store). Passez directement à l'étape 2 : la première commande theme avec --store= déclenchera l'ouverture du navigateur pour l'authentification.

Étape 2 : Identifier le bon thème

l

shopify theme list --store=VOTRE-BOUTIQUE.myshopify.com

Si c'est la première commande exécutée, le navigateur s'ouvre pour se connecter à la boutique : valider la connexion, puis relancer la commande si besoin.

• Repérer le thème live (publié) ou le thème de développement contenant les modifications à récupérer
• Noter son THEME_ID

Étape 3 : Cloner le repo GitHub (si pas déjà fait)

git clone https://github.com/Moon-Moon-team/NOM-DU-REPO.git
cd NOM-DU-REPO

Si le repo est déjà cloné en local, s'assurer d'être à jour avant de continuer :

git checkout main
git pull origin main

Étape 4 : Créer une branche dédiée

Pour isoler la récupération des modifications et pouvoir les relire avant de merger :

git checkout -b recuperation-theme-boutique

Étape 5 : Récupérer le thème depuis la boutique

Depuis la racine du repo cloné, télécharger le thème live (ou de dev) directement par-dessus les fichiers existants :

# Télécharger le thème live avec toutes les modifs faites en ligne
shopify theme pull --store VOTRE-BOUTIQUE.myshopify.com --live
 
# Ou en ciblant un thème précis par son ID
shopify theme pull --store VOTRE-BOUTIQUE.myshopify.com --theme=THEME_ID

Cette commande écrase les fichiers locaux avec la version présente sur la boutique. C'est voulu : l'objectif est de récupérer l'état réel du thème en ligne, modifications comprises.

Étape 6 : Vérifier ce qui a changé

Avant de committer, regarder précisément ce qui a été modifié sur la boutique :

git status
git diff

Points à vérifier particulièrement :

• Sections / snippets : nouveaux fichiers créés via l'éditeur en ligne, ou fichiers modifiés
• config/settings_data.json : changements de réglages faits dans le personnalisateur (couleurs, layout, contenu des sections, etc.)
• templates/*.json : sections ajoutées/retirées/réordonnées sur les pages
• locales/ : traductions modifiées directement dans l'admin
• assets/ : fichiers CSS/JS potentiellement édités via l'éditeur de code en ligne

⚠️ Si des fichiers non liés au thème apparaissent en diff (fichiers de config du repo, README, etc.), s'assurer qu'ils n'ont pas été touchés par erreur.

Étape 7 : Committer les changements

git add .
git commit -m "Récupération des modifications faites sur la boutique VOTRE-BOUTIQUE"

Pour des commits plus lisibles, il est possible de scinder par type de changement (settings, sections, locales…) plutôt que de tout committer d'un bloc.

Étape 8 : Pousser la branche et ouvrir une Pull Request

git push -u origin recuperation-theme-boutique

Ouvrir une Pull Request vers main pour :

• Faire relire le diff par un(e) autre développeur(se)
• S'assurer qu'aucune modification indésirable n'est intégrée
• Garder un historique clair de la synchronisation

Étape 9 : Merger dans main

Une fois la PR validée, merger dans main (ou la branche de référence du projet) puis supprimer la branche temporaire.

git checkout main
git pull origin main
git branch -d recuperation-theme-boutique

Points d'attention

Conflits avec le développement local en cours

Si du développement était déjà en cours sur main en parallèle des modifications faites sur la boutique, des conflits peuvent apparaître au moment du merge. Il faut alors :

• Résoudre les conflits fichier par fichier
• Vérifier en priorité config/settings_data.json et les fichiers JSON de templates/, souvent sources de conflits car modifiés des deux côtés

Ne pas écraser par erreur les modifications de la boutique

Ne jamais faire de shopify theme push vers la boutique avant d'avoir bien récupéré (pull) et committé l'état actuel : un push écraserait les modifications faites en ligne et les ferait perdre définitivement.

Garder la boutique et le repo synchronisés dans la durée

• Éviter autant que possible les modifications directes sur la boutique (personnalisateur, éditeur de code en ligne) une fois le suivi Git en place
• Si des modifications en ligne sont nécessaires (urgence, ajustement rapide par un tiers), prévoir une récupération régulière avec ce processus pour ne pas accumuler trop de dérive entre la boutique et le repo

Ressources

• Shopify CLI Documentation (opens in a new tab)
• shopify theme pull (opens in a new tab)
• Voir aussi : Migration de thème pour dupliquer un thème d'une boutique à une autre