logo-18

 

L’équipe du site E-commerce Faire Part Magnet a souhaité faire peau neuve, en passant d’un site fait entièrement à la main, mais qui commençait à vieillir, à la plateforme Canadienne Shopify.

Les 14 étapes d’une migration vers Shopify.

Pour une transition “en douceur”, et sans coupure ou mauvaises surprises pour les internautes, il a fallu penser la migration, et s’organiser. Elle s’est déroulée en 14 étapes successives, et s’est achevée avec succès.

Les étapes précieuses de la migration vers Shopify

  1. La mise en place de la plateforme Shopify
  2. La reprise de données d’exemple (images, textes)
  3. Outil de personnalisation existant
  4. Vérification du déroulé d’une commande sur Shopify
  5. Création de produits d’exemple sur Shopify
  6. Export des données de l’ancienne plateforme
  7. Import des données dans Shopify
  8. Modifications graphiques
  9. Tests et validation des tests
  10. Formation du personnel sur Shopify
  11. Réalisation de redirections 301 pour ne pas perdre les liens référencés dans Google
  12. Réglages des options de commande
  13. Redirection DNS du nom de domaine vers Shopify
  14. Suivi et mises à jour

Les étapes en détail

1. La mise en place de la plateforme Shopify

Capture d’écran 2016-07-24 à 10.23.51
Pour ceux qui ne connaissent pas la solution, Shopify est une solution E-commerce hébergée de qualité professionnelle, et qui permet la mise en place de sites E-commerce de manière aisée.

Pour mettre en place la plateforme, il faut commander un abonnement Shopify. Nous avons pris dans notre cas l’abonnement professionnel, qui permet de visualiser les statistiques, mais aussi de mettre en place des alertes automatiques.

Une fois commandée, la plateforme est immédiatement opérationnelle, et prête à fonctionner.

Attention à ne pas publier la boutique avant que celle-ci ne soit au minimum fonctionnelle (garder le mode brouillon jusqu’à ce que ce soit prêt)

2. La reprise de données d’exemple

Textes, et images d’exemple sont repris pour donner au site un aspect similaire à l’ancien. une grande importance a été donnée pour la page d’accueil, tant au niveau du design que de l’expérience utilisateur, car c’est LA page qu’il ne faut pas louper.

Les données d’exemple ont été aussi reprises pour étudier le déroulé de la navigation d’un visiteur, et tenter de le simplifier au maximum: par exemple: pas d’inscription obligatoire.

3. Outil de personnalisation en ligne

outil de personnalisation en ligne

Oui, le site contient un outil de personnalisation en ligne, qui permet aux internautes de rajouter des textes, images ou cliparts à leurs objets en ligne, avant de commander. Donc, drag’n’drop, zones d’images et de texte, enregistrement des personnalisations en haute définition, pour que les images soient prêtes pour l’impression (Web to print).

La reprise de l’outil de création de l’ancien site étant trop complexe, nous avons choisi de partir sur une nouvelle solution, en travaillant avec des développeurs HTML5 / Shopify.

4. Vérification du déroulé d’une commande sur Shopify

 Le déroulé de la commande est l’un des aspects les plus importants d’un site E-commerce. C’est pourquoi la navigation la plus aisée et compréhensible a été mise en place:

  • Page d’accueil
  • Choix du produit
  • Personnalisation du produit
  • Enregistrement –> Panier
  • Panier –> modification des quantités et des personnalisations
  • Commande
  • Confirmation de la commande

 

5. Création de fiches produits d’exemple sur Shopify

Fiches produit

Les produits d’exemple n’ont pour l’instant d’utilité que pour les tests, vu que la boutique est pour l’instant réglée comme étant en construction, donc non accessible au public.

Shopify permet de rajouter des images, mais aussi des champs de formulaire aux produits. Nous avons donc réfléchi aux déclinaisons de produits (taille, finition, prix, accessoires…).

Cela a permis une réorganisation des produits qui peuvent désormais être édités depuis un simple fichier Excel, puis importés dans la boutique.

6. Export des données de l’ancienne plateforme

L’ancienne plateforme étant un développement “fait maison” en php/mysql, il a été aisé d’extraire les données textuelles (par contre, pour les données images, ça a été plus galère, et il a fallu remettre les images produit par produit).

Pour extraire les données de Mysql, nous avons utilisé l’interface PhpMyAdmin. Le fichier exporté est un fichier CSV, ou XLS.

logo-og-300x212

Une fois que le fichier est en place, le fichier a été modifié pour répondre aux exigences de modèles de produits Shopify. Quelques colonnes à réorganiser ou a modifier, et le tout est joué.

7. Import des données dans Shopify

Une fois que le fichier d’export répond au modèle proposé par Shopify, nous importons en un seul clic l’ensemble des produits depuis Shopify. Titres, prix, description, sont importées.

Nous avons profité de ce fichier texte pour produire des variantes de produit.

Concernant les images, nous avons rencontré plus de difficultés, et il a fallu faire des opérations manuelles.

8. Modifications graphiques

Homepage du site

Homepage du site

Bien entendu, le site tel qu’il était à ce moment n’était pas présentable, et il fallait le modifier graphiquement, depuis l’interface d’administration de Shopify.

Il est possible d’éditer les fichiers de thème Shopify depuis l’interface d’administration, sans avoir à passer par un client FTP.

Une fois que quelques fignolages terminés, le grand jour approche! C’est le jour de sortie!

9. Tests et validation des tests

Bien sûr, on ne publie pas sans avoir testé et validé les bases même d’un site E-commerce: Déroulé des commandes en mode “live”, modes de livraison, outil de personnalisation, taxes, fiches produits, navigation… Tout est passé au crible et les problèmes sont corrigés en “live”.

10. Formation du personnel

Les habitudes sont bouleversées, et il convient que les personnes qui utilisent le Back Office soient à l’aise avec le nouvel outil!

La formation se prépare de la manière suivante:

– Vérification des similitudes avec l’ancienne plateforme
– Formation générale sur Shopify
– Formation aux nouvelles fonctionnalités
– Atelier de création de familles de produits, et de fiches de produits
– Atelier de création de modes de livraison
– Atelier de création de notifications automatiques
– Validation de la formation (certification home-made 🙂 )

11. Réalisation de redirections 301 pour ne pas perdre les liens référencés dans Google et autres moteurs de recherche.

google

ÉTAPE IMPORTANTE !

Pour que votre travail de référencement naturel ne soit pas balayé d’un coup, il convient de rediriger les anciennes URL vers les nouvelles.

Ouf! Shopify a cet outil qui permet de créer des redirections directement depuis l’admin, et c’est assez simple. Mais plus il y a de pages, plus c’est long!

12. Réglages des options de commande

Si le principal est fait, les options de commande permettent d’offrir à l’internaute une meilleure expérience utilisateur: plusieurs modes de paiement (chèque, virement, cb), mais aussi livraison, délais de livraison, suivi des commandes, transporteur…

Négligées, ces options ne feront qu’augmenter le taux d’abandon de panier, et le chiffre s’en ressentira.

 

13. Redirection DNS du nom de domaine vers Shopify

Shopify vous fournit une URL par défaut qui est la suivante: xxxx.myshopify.com , xxxx étant votre nom. Une option de Shopify permet de prendre en compte les changements effectués chez votre registrar pour la modification des DNS.

Ainsi, il a été possible de modifier les DNS chez le registrar, et de les faire pointer vers le nom shopify.

C’est l’étape qui marque l’abandon total de l’ancienne plateforme, qui ne sera plus utilisée par les internautes dès qu’elle sera appliquée…

Done!

14. Suivi et mises à jour

On pourrait croire que c’est terminé, mais ça ne l’est jamais. Tests constants, mises à jour, ajout de produit, suivi des Analytics, suivi du taux de rebond, amélioration des pages de destination… Trop de boulot vous attend, même après la migration.