Modifier le design de votre boutique MyCOMMERCE sur Wix

MyCOMMERCE a été conçue de manière professionnelle selon les dernières tendances de l’e-commerce afin de s’afficher proprement sur n'importe quel appareil. Si vous avez installé MyCOMMERCE sur votre page Web Wix, vous pouvez immédiatement commencer à faire des ventes. Néanmoins, vous pouvez modifier le design de votre boutique MyCOMMERCE sur Wix afin que votre boutique en ligne corresponde exactement à l'aspect général de votre site Web.

L'éditeur visuel intuitif dans l’application MyCOMMERCE pour Wix vous permet de modifier les polices et les couleurs de la boutique, d'ajuster la taille et le format des photos des produits, de modifier rapidement la mise en page des produits et du catalogue et de masquer des éléments de page, et tout cela sans programmation.

Astuce: Si vous avez besoin d'un design entièrement personnalisé, nous pouvons faire une personnalisation détaillée de la vitrine selon vos envies. Commandez un design individuel auprès de nos experts.

Dans cet article:

Modifier les polices et les couleurs dans la boutique
Modifier le design de la liste des produits
Modifier le design des pages de produits

Modifier les polices et les couleurs dans la boutique

L’application MyCOMMERCE pour Wix vous permet de sélectionner les couleurs préférées pour l'arrière-plan, le texte, les liens et les boutons de votre boutique, de changer la police et le flou d’arrière-plan, afin de créer une boutique en ligne qui corresponde parfaitement au style général du site Web.

Si vous n'êtes pas sûr des couleurs à choisir pour votre boutique, vous pouvez sélectionner les couleurs qui correspondent à la palette de couleurs de la page principale en utilisant la règle 60-30-10:

• la couleur primaire qui occupe 60% de l’affichage: la couleur d’arrière-plan;
• la couleur secondaire qui occupe 30% de l'affichage et qui contraste avec la couleur primaire: la couleur du texte;
• les couleurs d'accentuation qui occupent 10% de l’affichage et qui complètent votre couleur principale ou secondaire: la couleur des boutons, des liens et des prix des produits.

Pour les polices, nous recommandons de ne pas sélectionner plus de 2-3 polices pour la page Web: une pour les titres, une pour les sous-titres (facultatif) et une pour les zones de contenu. Utiliser trop de polices différentes peut donner à votre site Web un aspect désordonné et amateur. Les gens peuvent avoir du mal à reconnaître les messages importants que vous essayez de communiquer.

Pour changer la police et les couleurs de la boutique:

1. Ouvrez votre Éditeur de site Web Wix et ouvrez la page sur laquelle votre boutique MyCOMMERCE est installée (par défaut ceci est la page de la boutique en ligne).

3. Dans le menu popup, passez à l'onglet Conception:

4. Sélectionnez la police préférée dans la section Font Style - Police et couleur:

5. Sélectionnez la couleur d'arrière-plan de la page dans le bloc fond et ajustez l'opacité si nécessaire:

6. Définissez les couleurs pour le texte, les prix des produits, les liens et les boutons dans les choix de couleurs appropriés:

7. Si vous n'êtes pas satisfait des modifications de couleur effectuées, vous pouvez les réinitialiser à tout moment en cliquant sur Restaurer les couleurs par défaut:

Vous pouvez vérifier le résultat de votre travail dans le mode prévisualisation. Quand vous avez terminé d'éditer les polices et les couleurs, n'oubliez pas de publier votre site Web afin d’appliquer les modifications.

Modifier le design de la liste des produits

Les listes de produits sont des pages qui affichent les articles affectés à la même catégorie de produits ou à la page d'accueil de la boutique. Vous pouvez personnaliser l'aspect de vos produits dans les pages de liste de l'application MyCOMMERCE pour Wix.

Vous pouvez par exemple contrôler la taille et le format des photos des produit (vignettes). Les grandes photos sont généralement parfaites pour présenter tous les détails importants de vos produits, les photos moyennes sont un bon équilibre pour la plupart des produits, tandis que les petites photos vous permettent de placer plus de produits par page. Les petites photos conviennent bien si vos produits sont mieux présentés par la description que par l'image, par exemple les pièces de voiture, différents appareils, etc.

Les modèles de format vous permettent d'ajuster les pages de liste pour les photos alignées horizontalement ou verticalement. Vous pouvez également assombrir les arrière-plans des vignettes afin de mettre en évidence les produits sur la page.

Essayez de changer l'alignement du texte dans les fiches produits ou la visibilité des boutons Noms de produits, Prix et Acheter maintenant si vous voulez créer un aspect plus aéré sur les pages de liste des produits.

Sur la page ci-contre, vous pouvez afficher les boutons Nom du produit, Prix et Acheter maintenant et permettre à vos clients de mettre des articles dans le panier directement à partir des pages du catalogue.

Astuce: Quand vous testez différents paramètres, vous pouvez obtenir une prévisualisation en direct du résultat sans avoir à recharger la page ou à publier la page Web. Si vous n'êtes pas satisfait du résultat, vous pouvez restaurer l'aspect par défaut à tout moment.

Pour personnaliser l'aspect des pages de liste des produits:

1. Ouvrez votre Éditeur de site Web Wix et ouvrez la page sur laquelle votre boutique MyCOMMERCE est installée (par défaut ceci est la page de la boutique en ligne).
2. Cliquez n'importe où dans le bloc avec vos produits et sélectionnez Paramètres:

3. Dans le menu popup, passez à l'onglet Liste de produits (Product list):

4. Modifiez la taille et le format de la vignette (Thumbnail size and aspect ratio):

5. Activez l'option pour assombrir les arrière-plans des vignettes (Darken thumbnail background):

6. Personnalisez l'alignement du texte et des boutons dans les fiches produits (Product card alignement):

7. Activez l’option si vous voulez afficher une marge autour des fiches produits (Product card border):

8. Sélectionnez si vous voulez afficher le nom du produit, le prix, l’UGS, le bouton Acheter maintenant et d'autres photos du produit (photos de la galerie) sur les pages de la liste des produits, les afficher avec la souris ou les masquer:

Vous pouvez vérifier le résultat de votre travail dans le mode prévisualisation. Quand vous avez terminé d'éditer le design des pages de liste des produits, n'oubliez pas de publier votre site Web afin d’appliquer les modifications.

Modifier le design des pages de produits

Les pages de produits sont des pages qui contiennent des informations détaillées sur un produit: sa description, une galerie avec des photos supplémentaires, le prix, le stock restant, les variantes et plus encore.

Vous pouvez modifier l'aspect des pages de produits dans l’application MyCOMMERCE pour Wix en modifiant la mise en page et la visibilité des éléments dans la barre latérale.

Il existe plusieurs options de mise en page au choix:

• 2 colonnes avec description du produit sur le côté droit: une option standard qui convient très bien avec des photos de haute qualité et une description courte;
• 2 colonnes avec description du produit sous la photo: une mise en page classique, idéale pour les produits avec des descriptions longues;
• 2 colonnes avec description du produit sur le côté gauche: une mise en page symétrique pour les produits qui sont mieux représentés par leur description que par l'image;
• 3 colonnes: une mise en page riche en contenu qui peut afficher autant d'informations que possible sur un seul écran et qui convient idéalement aux grands écrans.

Pour modifier l'aspect des pages de produits:

1. Ouvrez votre Éditeur de site Web Wix et ouvrez la page sur laquelle votre boutique MyCOMMERCE est installée (par défaut ceci est la page de la boutique en ligne).

3. Dans le menu popup, passez à l'onglet Produit (Product):

4. Sélectionnez la mise en page préférée dans la section Mise en page des détails du produit (Product details layout):

5. Sélectionnez la façon dont vous voulez afficher les photos de la galerie dans la section Mise en page de la galerie des produits (Product gallery layout):

6. Définissez les détails des produits que vous souhaitez afficher dans la zone de contenu de la barre latérale (Sidebar content):

Vous pouvez vérifier le résultat de votre travail dans le mode prévisualisation. Quand vous avez terminé d'éditer le design des pages de détails des produits, n'oubliez pas de publier votre site Web afin d’appliquer les modifications.

Astuce: Vous pouvez également ajouter un symbole de panier et une barre de recherche de produits à vos pages Web. Le panier permet à vos clients de vérifier le contenu et de passer rapidement à la caisse depuis n’importe quelle page de votre site Web. Grâce à la barre de recherche, les visiteurs de la boutique peuvent facilement trouver ce qu'ils cherchent sans avoir à parcourir les pages de la boutique.