Comment générer des fiches produit pour l'ensemble de votre catalogue Shopify sans codage (avec Make) ?

Si vous travaillez dans l'e-commerce, vous savez probablement à quel point la création de fiches produit pour votre catalogue Shopify est longue et fastidieuse.

La mise en page est l'une des tâches les plus fastidieuses et sans valeur ajoutée.

Dans ce tutoriel, nous allons vous montrer comment générer des descriptions de produits pour votre catalogue Shopify en utilisant Make (Intergomat). En particulier, nous utiliserons Abyssale

Créer vos visuels avec Abyssale

Vous aurez besoin de visuels pour la description de votre produit. Pour marquer votre image de marque, vous devrez peut-être procéder à quelques modifications.

Pour vous donner un exemple, nous avons décidé de simuler la création d'une fiche produit pour une marinière à manches longues pour femmes. Voici à quoi ressemblent les visuels que nous voulons créer :

Visuel 1 :

Visuel 2 :

Nous créons templates en format 1080x1080 px à partir de Abyssale. Pour adapter ces visuels à chaque produit, certains éléments doivent être modifiables.

Pour le visuel 1, seule la photo de la marinière sera modifiée. L'élément s'appellera "product_photo".

Pour le visuel 2, il y a plus d'éléments : la photo du produit, les zones de texte en blanc sur fond bleu, et le prix. Voici comment nous les nommerons dans le site Abyssale template :

• product_photo
• material
• sizes
• colors
• country
• washing
• price

Une fois que le site templates est prêt, vous pouvez générer vos premiers visuels en cliquant sur Single generation.

Créer un template pour vos fiches produit Shopify

Avant d'automatiser quoi que ce soit, vous devez établir une base structurelle pour vos fiches produit.

Connectez-vous à votre compte Shopify. Dans la colonne de gauche, cliquez sur "products". Cliquez ensuite sur le bouton "ajouter un produit" en haut à droite de votre écran.

Vous accéderez ainsi à l'outil de création de produits. Modifiez la description de votre premier produit. Lorsque vous la construisez, gardez à l'esprit que toutes les fiches produit auront la même structure.

Voici à quoi ressemble la description de notre produit :

Nous avons ajouté la photo à partir de son URL. Pour récupérer cette adresse, faites un clic droit sur la photo générée précédemment sur Abyssale et sélectionnez "copier l'adresse de l'image".

Une fois la structure de votre description de produit terminée, cliquez sur "&lt/&gt" dans le coin supérieur droit du générateur. Le code HTML de votre description apparaît.

Voici à quoi ressemble le code HTML de l'exemple de description :

‍

Ce code servira de template pour toutes vos fiches produit.

Dans notre exemple, il y a 7 éléments dans l'ordre :

• 1 Titre H1
• Une zone de texte de 1ʳᵉ.
• Une 1ʳᵉ photo
• 1 Titre H2
• Une zone de texte de 2ᵉ.
• Une 2ᵈᵉ photo
• Une zone de texte de 3ᵉ.

Créer une base de données avec Google Sheets

Maintenant que vous avez le code de votre template et que les templates pour vos visuels sont prêts, vous allez devoir créer une base de données. Au fur et à mesure que vous la remplirez, de nouveaux produits seront automatiquement ajoutés à Shopify (la dernière étape de ce tutoriel consistera à automatiser la génération des visuels et des fiches produit).

Commencez par créer un nouveau document Google Sheets. *Dans notre exemple, nous l'appellerons "Shopify Product Descriptions".

Sur la première ligne, nous ajouterons les colonnes suivantes :

• Title (pour le nom du produit)
• Type of product (pour le type de produit)
• x colonnes pour chaque élément du second Abyssale template *.
• x colonnes pour chaque élément de votre fiche produit template. Pour notre exemple, nous aurons 6 colonnes**.
• HTML body (pour la fiche produit HTML)

(*) Voici comment nous avons nommé les 6 colonnes du 2e visuel Abyssale pour notre exemple:

• Material
• Size
• Colors
• Country
• Washing
• Price

(**) Voici comment nous avons nommé les 6 colonnes concernant la fiche produit de notre exemple :

• Title H1
• Intro text
• Product photo
• Title H2
• Description text
• CTA

Créer un scénario Make

C'est la dernière opération avant d'automatiser la création de votre fiche produit. C'est aussi la plus longue et celle qui demande le plus de concentration. Rien de bien compliqué ! Veillez simplement à bien suivre chaque étape.

Une fois que vous avez créé un nouveau scénario Make , n'oubliez pas de le renommer afin de pouvoir le retrouver facilement par la suite.

Dans notre exemple, nous le renommerons "Shopify Product Description Tutorial".

Ajouter un module Google Sheets "Watch news rows"

Connectez le document Google Sheets que vous avez créées précédemment.

Ajouter un module Abyssale "Generate single image".

Ce module sera utilisé pour générer la première photo de notre exemple. Connectez le module Abyssale template. Ajoutez ensuite les variables dans les lignes correspondantes.

Dans notre exemple, nous allons sélectionner le site "Photo 1 Shopify" template et ajouter la variable [Photo 1 (K)] à la ligne "Element : product_photo / image_url".

Ajouter un nouveau module Google Sheets "Updates a row".

Compléter quelques lignes pour que l'url de l'image 1 générée par Abyssale s'enregistre dans la base de données :

• Numéro de ligne = [Row number] (à partir du premier module de Google Sheets)
• Photo 1 Shopify = [File : File url] (du premier module Abyssale )

Répétez l'opération autant de fois que vous avez d'images à générer avec Abyssale

Pour notre exemple, nous ajoutons un deuxième module Abyssale "Generate Single Image". Après avoir connecté ce module à notre deuxième photo, nous remplissons les lignes comme suit :

• Title - payload = [Title (A)] (du module 1 de Google Sheets)
• product_photo - image_url = [Product Photo (K)] (from Google Sheets module 1)* material - payload = [Product Photo (K)] (from Google Sheets module 1) (from Google Sheets module 1)
• material - payload = [Material (C)]  (du module 1 de Google Sheets)*
• Size - payload = [Size (D)] (d'après Google Sheets module 1)
• colors - payload = [Colors (E)] (du module 1 de Google Sheets)
• country - payload = [Country (F)] (du module 1 de Google Sheets)
• washing - payload = [Washing (G)] (extrait du module 1 de Google Sheets)
• price - payload = [Price (H)] (à partir du module 1 de Google Sheets)

Ensuite, un nouveau module Google Sheets "Updates a Row" nous permet d'enregistrer l'url de l'image générée par Abyssale dans la colonne "Photo 2 Shopify" de la base de données.

Ajouter un module Google Sheets "Updates a row".

L'objectif est ici de créer automatiquement le HTML de votre description à partir des informations qui apparaissent dans vos documents Google Sheets. Vous devez remplir chaque colonne manuellement, à l'exception de "Photo 1 Shopify", "Photo 2 Shopify" et "Body HTML", que votre automate Make remplira.

Il n'y a que deux lignes à remplir dans ce module :

• Dans la ligne du numéro de ligne, sélectionnez la variable [Row number].

• Dans la ligne Body HTML, c'est un peu plus technique :

Commencez par coller le code HTML de votre template. Ensuite, localisez chacun des éléments de texte et remplacez-les par les variables correspondantes sans toucher au reste du code.

Dans notre exemple, nous avons remplacé :

• "Embrace the style of the sea" avec la variable [Title H1 (I)].
• "With its simple, streamlined style, this long-sleeved swimsuit can be adapted to almost any everyday situation" par la variable [Intro Text (J)]
• "https://production-banners.s3-eu-west-1.amazonaws.com/1a89bf91-a4ae-46e8-8ba7-809cc3cedd14/9a8dcf7e-fc33-4a96-b11d-499a6af0c883.jpeg" par la variable [File : File url] dans le premier module Abyssale .
• et ainsi de suite... pour arriver au résultat ci-dessous :

• La section "Body HTML" est un simple copier-coller de la section "Body HTML" du précédent module Google Sheets "Updates a Row".

En outre, nous avons délibérément choisi le statut "brouillon" pour éviter que le produit n'apparaisse directement dans le catalogue. Il y aura encore quelques ajustements à faire sur Shopify avant de le mettre en vente et de changer son statut en "actif".

Enfin, voici à quoi ressemble notre scénario :

Plus vous avez d'images provenant de Abyssale templates , plus votre scénario sera long.

Testez votre scénario

Si vous avez suivi pas à pas les instructions de ce tutoriel, tout devrait fonctionner. Cependant, il peut arriver que vous n'arriviez pas à faire ce qu'il faut. C'est pourquoi il est important de tester votre scénario.

Commencez par ajouter une ligne à votre document Google Sheets. Ensuite, sur Make, exécutez le scénario.

Si aucun message d'erreur n'apparaît, vous devez :

• trouver les URLs générées par Abyssale dans les colonnes "Photo 1 Shopify" et "Photo 2 Shopify".
• trouvez le code HTML de votre fiche produit dans la colonne "body HTML" de votre document Google Sheets.
• voir un nouveau produit apparaître dans la liste des produits de votre boutique Shopify, comme sur la photo ci-dessous.

Il suffit de cliquer sur le produit pour compléter les informations manquantes (prix, délais de livraison, etc.).

Vous êtes maintenant prêt à rédiger des fiches produit plus rapidement avec Abyssale !

Suivez-nous sur LinkedIn pour vous tenir au courant des dernières nouvelles Abyssale et découvrir chaque semaine de nouveaux conseils en matière d'automatisation.

‍