Intégrations

Comment ajouter un widget de taille sur Wix

Intégrez un widget de recommandation de tailles sur vos pages produits Wix en une heure

Sur cette page
  1. Pourquoi Wix Stores en a plus besoin qu'il n'y paraît
  2. Deux façons d'intégrer un widget dans Wix
  3. Placer le widget sur la page produit
  4. Valider l'intégration par rapport à Wix Stores
  5. Où YourSizer s'inscrit
  6. Questions Fréquentes
  7. Conclusion

Wix alimente désormais une part significative des vitrines de mode indépendantes, mais la plupart des marchands Wix Stores s'appuient toujours sur un beden tablosu PDF statique ou un embed de tableau. Cette lacune compte : les acheteurs qui ne peuvent pas répondre « quelle taille dois-je porter » sur place abandonnent simplement le panier ou achètent deux tailles et en retournent une. Corriger ce problème sur Wix nécessite un embed de page et, si vous souhaitez le connecter aux variantes de produits, un court script Velo.

Wix n'a pas été conçu avec une couche native de recommandation de taille, mais ses APIs Custom Element / HTML iframe et Velo (plateforme JavaScript de Wix) vous offrent deux chemins pratiques pour en ajouter une. Ce guide vous montre les deux routes, vous indique exactement où le widget doit se situer sur la page produit, et couvre comment confirmer qu'il lit réellement les données de variante de Wix Stores plutôt que de simplement flotter au-dessus.

Pourquoi Wix Stores en a plus besoin qu'il n'y paraît

Les pages produits Wix Stores sont en template : la même mise en page galerie-plus-zone-d'achat se répète dans tout le catalogue, ce qui est excellent pour la vitesse mais laisse peu de place aux conseils d'ajustement au-delà d'une liste déroulante de tailles. Les vêtements et chaussures ont déjà des taux de retour bien au-dessus de la moyenne du commerce de détail, et les retours de chaussures en particulier font partie des plus élevés de toute catégorie de produits. Sur une plateforme où la plupart des marchands sont de petites à moyennes marques de vêtements ou de chaussures, cette lacune structurelle s'aggrave — il n'y a pas d'équipe de développement interne qui la corrigerait discrètement avec une logique d'ajustement personnalisée comme le feraient les marchands d'une plateforme plus grande.

Le coût en amont est bien documenté au niveau de l'industrie, même si votre propre tableau de bord ne le ventile pas. La National Retail Federation estime le chiffre des retours américains de 2024 à environ 890 milliards de dollars, les taux de retour en ligne avoisinant 19-20 % (nrf.com), et McKinsey estime que les retours coûtent plus de 40 milliards de dollars par an aux marques de mode dans le monde (mckinsey.com). Un widget de taille n'élimine pas ce coût, mais il cible le principal moteur des retours de vêtements : ne pas savoir quelle taille cliquer avant le paiement.

Deux façons d'intégrer un widget dans Wix

Wix vous offre deux routes d'intégration réalistes, et celle que vous choisissez dépend de la profondeur avec laquelle vous souhaitez connecter le widget à votre catalogue.

1. Embed HTML (Custom Element / Embed a Widget). Dans l'éditeur Wix, allez à Ajouter des éléments → Embed → Custom Embeds → HTML iframe, déposez-le sur le template de page produit, et collez le snippet d'embed du widget (généralement une balise <script> plus une <div> de montage). C'est le chemin le plus rapide — aucun code au-delà du copier-coller — et il fonctionne sur n'importe quel plan Wix Stores qui permet les embeds de code personnalisé.

2. Velo (la plateforme de développement de Wix). Si vous souhaitez que le widget lise la variante sélectionnée par l'acheteur, transmette automatiquement le contexte de l'ID produit/SKU, ou écrive une taille confirmée dans les options de produit avant le panier, vous aurez besoin de Velo. Activez le mode de développement sur le site, ajoutez un <htmlComponent> (ou utilisez le même élément iframe) sur le template de page produit, et utilisez $w.onReady() plus les APIs Wix Stores Product Page (wixStoresFrontend / $w('#productPage') context) pour transmettre les données du produit au widget et écouter son événement size-selected.

Le tableau ci-dessous est un moyen rapide de décider quelle route correspond à votre situation :

BesoinRoute
Afficher uniquement les conseils d'ajustement, sans transmission de donnéesEmbed HTML, aucun code
Auto-détecter l'ID de produit/catégorie au chargementVelo, transmettre le contexte sur $w.onReady()
Écrire la taille recommandée dans le sélecteur de varianteVelo, écouter l'événement postMessage du widget
Multiples templates de produits (par exemple, robes vs chaussures)Velo, montage conditionnel par template

Placer le widget sur la page produit

Le placement décide si le widget sera utilisé ou non. Sur les templates de pages produits Wix, la zone d'achat (prix, liste déroulante de variante, bouton ajouter au panier) se trouve dans une colonne fixe, et le widget de taille doit se situer directement en dessous ou à côté du sélecteur de taille — pas enterré sous la description ou dans un onglet séparé.

Quelques notes de placement spécifiques à l'éditeur de Wix :

  • Ancrez l'élément embed à la même section que la liste déroulante de variante afin qu'il défile avec la zone d'achat sur mobile, pas avec la galerie de produits.
  • L'éditeur mobile de Wix traite les mises en page de bureau et mobiles séparément — vous devrez repositionner l'embed indépendamment sur la vue mobile, car Wix n'hérite pas toujours du placement de bureau 1:1.
  • Si vous exécutez le widget sur plusieurs templates de produits (Wix Stores en prend en charge plusieurs), répétez l'étape d'embed pour chaque template plutôt que de supposer qu'une seule mise en place couvre le catalogue.
  • Gardez le déclencheur visible sans défilement sur mobile ; un widget qui n'apparaît qu'après un défilement reçoit une fraction de l'engagement.

C'est le même principe abordé dans comment ajouter un widget de recommandation de taille à Shopify — la plateforme change, mais la proximité avec la zone d'achat est ce qui détermine l'utilisation, indépendamment de la vitrine.

Valider l'intégration par rapport à Wix Stores

Avant de considérer que c'est fait, faites un court passage de validation. Cela capture les deux modes d'échec qui apparaissent le plus souvent sur Wix : le widget se monte mais ne lit pas le contexte du produit, et le widget fonctionne sur bureau mais pas sur la mise en page séparée de l'éditeur mobile.

  1. Chargez la page produit active (pas seulement l'aperçu de l'éditeur) — le sandboxing d'iframe de Wix se comporte différemment en mode aperçu vs. mode publié.
  2. Confirmez la sensibilisation aux variantes. Si vous utilisez Velo pour transmettre l'ID de produit ou la catégorie, vérifiez la console du navigateur pour le payload d'initialisation du widget et vérifiez qu'il correspond au produit que vous visualisez.
  3. Testez la mise en page mobile séparément, car Wix maintient un état d'éditeur mobile indépendant.
  4. Vérifiez le flux du panier si vous avez connecté un rappel size-selected — confirmez que la taille recommandée remplit réellement la liste déroulante de variante de Wix plutôt que simplement d'afficher en ligne.
  5. Vérifiez plusieurs SKUs, y compris ceux avec des gammes de tailles inhabituelles (petite taille, taille plus, largeur large), pour vous assurer que le widget n'échoue pas silencieusement sur des structures de variantes non standard.

Rien de cela ne nécessite de travail personnalisé sur le serveur principal si vous utilisez la route d'embed HTML — c'est principalement de l'inspection d'éditeur et de navigateur. Les intégrations Velo justifient un peu plus de tests car vous dépendez de la stabilité des APIs frontend de Wix à travers les mises à jour de l'éditeur.

Où YourSizer s'inscrit

Le widget YourSizer est conçu pour s'adapter exactement à ce type d'emplacement d'embed — il se monte via une balise de script légère, donc la route d'embed HTML dans Wix fonctionne immédiatement sans avoir besoin de code Velo. Pour les marchands qui souhaitent une intégration plus étroite (auto-détection de la catégorie du produit, ou écriture de la taille recommandée dans la liste déroulante de variante), le même embed expose les hooks que Velo a besoin de lire et d'agir sur sa sortie.

Il ne nécessite pas de migrer votre catalogue de produits ou de remplacer les options de taille natives de Wix Stores — il se situe à côté d'eux, posant à un acheteur quelques questions rapides (ou lisant les mesures enregistrées lors de visites répétées) et retournant une recommandation de taille mappée à votre beden tablosu existant. Pour les marchands Wix spécifiquement, cela signifie aucun changement de serveur principal et aucune dépendance vis-à-vis des intégrations de marché d'applications plus limitées de Wix.

Questions Fréquentes

L'ajout d'un widget de taille à Wix nécessite-t-il un plan Wix Business ou supérieur ?

Cela dépend de la méthode d'embed. L'embed HTML/Custom Element est disponible sur les plans Wix qui prennent en charge le code personnalisé, ce qui pour Wix Stores signifie généralement n'importe quoi au-dessus des niveaux non commerciaux les plus basiques. Velo (Dev Mode) est gratuit à activer sur n'importe quel plan de site qui inclut Wix Stores, donc la route basée sur le codage n'est pas fermée par un plan de coût plus élevé en elle-même — les considérations de coût proviennent généralement du fournisseur de recommandation de taille, pas des frais de plateforme de Wix.

Un widget de taille ralentira-t-il ma page produit Wix ?

Un widget bien construit se charge de manière asynchrone et ne devrait pas bloquer le rendu initial de la page produit, car il se monte dans son propre iframe ou conteneur après le chargement du contenu principal de la page. Le plus gros risque sur Wix spécifiquement est d'empiler trop d'embeds tiers (chat, avis, upsells, widget de taille) sur un template, ce qui peut s'additionner même si chaque script individuel est léger. Il vaut la peine de vérifier la vitesse de la page avant et après l'ajout d'un embed, en utilisant les outils de performance du site de Wix ou un outil général comme PageSpeed Insights.

Le widget peut-il écrire la taille recommandée directement dans le sélecteur de variante de Wix ?

Oui, mais uniquement via la route Velo. L'embed HTML seul peut afficher une recommandation à l'acheteur, mais il ne peut pas atteindre la liste déroulante de variante native de Wix Stores sans code Velo écoutant l'événement de sortie du widget et appelant l'API Wix Stores Product Page pour définir l'option sélectionnée. C'est une étape commune suivante une fois qu'un marchand a validé l'embed de base et souhaite réduire le clic supplémentaire entre « voir la recommandation » et « ajouter la taille correcte au panier ».

Conclusion

L'éditeur de Wix et la plateforme Velo sont assez flexibles pour prendre en charge un widget de recommandation de taille sans une reconstruction complète de la vitrine, mais la valeur n'apparaît que si le widget se situe là où les acheteurs regardent déjà — à côté du sélecteur de taille, pas en bas de la page. À mesure que plus de marchands Wix Stores dans l'habillement et la chaussure traitent les conseils d'ajustement comme une fonctionnalité de base plutôt qu'un plus, les plateformes et les intégrations qui rendent cela un embed rapide plutôt qu'un projet de développement personnalisé finiront par établir la norme pour le reste du catalogue.

Passez à la pratique

Voyez YourSizer sur votre propre boutique

Recommandation de taille, modèle corporel 3D et essayage par photo — sur vos fiches produit en une journée.