Guide WooCommerce : Produit variable - Wenovio
WENOVIO
1-844-WENOVIO

Ma soumission gratuite en un clic!

Vos coordonnées


X

Service Requis

LogoGraphismeApplication webSite webPublicité numériqueApplication mobile__Autre service

Guide WooCommerce : Produit variable

Lecture de 4 minutes

Cliquez ici pour lire le premier article de cette série.

Cliquez ici pour lire le troisième article de cette série.

Deuxième partie de notre guide pratique

À la fin de l’article vous trouverez une vidéo qui permet de visualiser tout ce qui est vu dans cet article. Cliquez ici pour la voir.

Un produit variable permet de proposer aux clients un ensemble de variation d’un produit. Il est possible de faire varier le prix, le stock, la photo, ainsi que les différents attributs. Un attribut dans WooCommerce est en fait une option. Si par exemple vous vendez des tee-shirt, un attribut sera la taille (petite, moyenne, grande, etc.) ou bien la couleur (rouge, bleu, vert, etc.).

Voici un exemple du produit variable que nous allons créer. Comme nous sommes au Québec, nous allons proposer des glaçons (!) avec deux attributs: le nombre et la couleur.

 

Création des attributs

Nous allons créer les deux attributs Nombre et Couleur. Se rendre dans le menu Produits / Attributs puis mettre le nom de l’attribut dans le champ Nom. Il n’est pas nécessaire de remplir le champ identifiant.

Valider en cliquant sur Ajouter un produit.

WooCommerce-attributs
Cliquer pour agrandir

Les deux attributs s’affichent maintenant sur la droite de l’écran.

Création des termes

Les termes sont les options des attributs. Pour l’attribut Couleur, ce sera Noir&blanc et Couleur.
Pour l’attribut Nombre, ce sera Un, Deux et Trois.

Cliquer sur Configurer les termes

WooCommerce attributs
Cliquer pour agrandir

WooCommerce Termes

Maintenant que les termes sont écrits, ils s’affichent à coté des attributs. Les termes de l’attribut Nombre ne sont pas ordonnés

WooCommerce Attributs Termes

Voici comment les ordonner

WooCommerce terme ordre

Les attributs et les termes sont maintenant créés. Voyons maintenant comment les insérer dans un produit.

Configurer les attributs dans un produit variable

Dans la fiche produit, sélectionner l’option Produit variable puis dans le menu Attributs, ajouter les attributs en suivant les exemples des animations ci-dessous.

Ajout de l’attribut Couleur:

Ajout de l’attribut Nombre:

La case Visible sur la page produit permet d’afficher les attributs dans la fiche produit comme vous pouvez le voir sur la capture ci-dessous:

WooCommerce fiche produit attributs
Cliquer pour agrandir

 

Mise en place des variations dans la fiche produit

Maintenant que les attributs sont définis pour ce produit, il faut configurer les variations. Pour cela, on va dans le menu Variations, et nous ajoutons toutes les variations en sélectionnant l’option Créer les variations pour tous les attributs.

Automatiquement, cela va créer les 6 variations de produits, (les 3 nombres x les 2 couleurs)

WooCommerce variations
Ajout des variations au produit

 

Maintenant, les deux variations s’affichent sur la page du produit du site.

Modifier les options pour chaque variation

Pour chaque variations, on va pouvoir ajouter une photo, un prix, un poids, des dimensions…
Il faut développer chaque écran en cliquant sur la petite flèche comme indiqué dans la capture ci-dessous:

L’écran ci-dessous apparaît.

Pour ajouter une photo, il faut cliquer sur le petit icône bleu. Ensuite vous pouvez ajuster les tarifs, l’état du stock, le poids, les dimensions…

Une fois que tout est complet, on enregistre en cliquant sur le gros bouton bleu (Enregistrer les changements)

Image produit par défaut

Pour finir il est possible d’ajouter une image par défaut pour le produit. C’est celle qui s’affichera si aucune variation n’est sélectionnée. Pour cela il faut ajouter une Image produit en cliquant sur Définir une image produit dans la partie droite de l’écran.

Prochain article

Dans notre prochain article, nous vous expliquerons comment installer et configurer WooCommerce.

L’article en vidéo

Voici en vidéo toute la procédure que nous venons de voir dans cet article.


Cliquez ici pour lire le premier article de cette série.

Cliquez ici pour lire le troisième article de cette série.

Laisser un commentaire