Wise Trail Running, visuel de couverture

2025

Wise Trail Running

Voir le site →

Développement du thème Shopify Plus sur-mesure · Theme custom + Functions & Flow

Contexte

Wise Trail Running avait un thème acheté, personnalisé saison après saison jusqu’à devenir lourd et instable : LCP à 3,15 s, INP à 176 ms, CLS à 0,07. Le mobile, pourtant l’usage principal de la marque, en souffrait le plus.

Le chantier : reconstruire un thème Shopify sur-mesure, structurer le merchandising avec l’équipe projet, et poser les briques techniques (Functions, Flow, logique panier) pour que l’équipe marketing reste autonome sur le contenu.

Résultat après mise en ligne : LCP à 0,99 s, INP à 64 ms, CLS à 0,01. Sur la période suivante, le chiffre d’affaires a progressé de 62 % par rapport à l’année précédente.

Objectifs & livrables

Expérience mobile-first

Parcours trail pensé pour le mobile : navigation rapide, PDP lisibles, checkout sans friction.

Merchandising éditable

Sections Shopify 2.0, metafields et blocs pour piloter le contenu sans passer par le code.

Mécaniques panier natives

Gift with purchase, automatisations Flow et switch produit, sans apps inutiles.

Ouverture multi-marchés

Migration des URLs et structure Shopify Markets pour ouvrir plusieurs marchés, dont des marchés dédiés à des partenaires indépendants.

Panier

Drawer & upsells

Drawer latéral piloté par Alpine.js et la Section Rendering API, avec trois mécaniques d’upsell natives : recommandations Shopify dans le drawer, duo produit en fiche via metafields, et packs multi-produits.

Marque

Storytelling trail

Pages et sections éditoriales pour porter l’univers outdoor sans ralentir le parcours d’achat.

Fiche produit

PDP pensée pour convertir

Variants, preuves sociales et informations techniques trail mises en avant. Structure claire pour réduire le doute avant l’ajout au panier.

Collection

Catalogue outdoor lisible

Grille collection, filtres et cards produit calibrés pour un catalogue trail dense, sans surcharge visuelle.

Sous le capot

Au-delà de l’intégration visuelle, plusieurs mécaniques Shopify natives ont été mises en place pour couvrir le panier, les automatisations et le parcours produit, sans dépendance à une app jetable. Le panier est un drawer piloté par Alpine.js et la Section Rendering API, avec trois étages d’upsell natifs construits sur des metafields plutôt que sur des apps tierces.

Cart TransformFunctions

01 / 05

Cart Transform : gourdes offertes

Problème

Offrir deux gourdes avec un gilet éligible, sans multiplier les SKU fantômes ni fausser le stock, alors que la gourde reste par ailleurs vendue seule.

Approche

Une Shopify Function Cart Transform évalue le panier à chaque mise à jour. Si un gilet éligible est présent, deux gourdes sont ajoutées au panier à prix 0, rattachées à la même référence de stock que la gourde vendue séparément. Suppression et ajustement gérés côté Function pour éviter les doublons ou qu’un client détourne l’offre en retirant le gilet après coup. Résultat : une mécanique native, testable, avec une donnée de stock qui reste cohérente entre l’offert et le vendu, sans app GWP tierce.

Cart Transform : gourdes offertes

Shopify FlowOps

02 / 05

Shopify Flow : automatisations

Problème

Des actions répétitives (tags client, alertes internes, segments) étaient faites à la main ou via des scripts fragiles.

Approche

Configuration de Flows Shopify déclenchés sur order paid / customer created : • Tagging client selon panier ou collection • Notifications internes pour commandes sensibles • Préparation de segments marketing sans code custom Les Flows restent éditables par l’équipe, documentés, et découplés du theme.

Shopify Flow : automatisations

CartUX

03 / 05

Switch entre produits

Problème

Sur certaines gammes, le client doit basculer entre variantes ou références liées (pack vs unitaire, alternative taille/couleur) sans perdre le contexte panier.

Approche

Logique front + contraintes panier pour proposer un switch clair : • UI de sélection liée sur PDP / drawer • Mise à jour du line item sans recharger toute la page • Cohérence avec Cart Transform (le gift suit les règles après switch) Objectif : un parcours compréhensible, sans app bundle opaque.

Switch entre produits

PerformanceCore Web Vitals

04 / 05

Reconstruction du thème : performance

Problème

Le thème d’origine, acheté puis personnalisé saison après saison, était devenu lourd : LCP à 3,15 s, INP à 176 ms, CLS à 0,07. Le mobile, pourtant l’usage principal, en pâtissait le plus.

Approche

Reconstruction sur une base OS 2.0 propre : templates JSON allégés, Tailwind compilé plutôt qu’un CSS accumulé au fil des saisons, Alpine.js pour l’état d’interface (drawers, menus) et Web Components pour la logique métier (variants, panier, recommandations). La Section Rendering API remplace les rechargements de page pour le panier et les filtres. Chaque bloc ajouté (upsell, livraison écologique, packs) passe par ce même mécanisme plutôt que par un rechargement complet. Résultat mesuré après mise en ligne : LCP à 0,99 s, INP à 64 ms, CLS à 0,01.

Reconstruction du thème : performance

UpsellMetafields

05 / 05

Trois étages d’upsell natifs

Problème

Augmenter le panier moyen sans multiplier les apps qui dupliquent les données produit et alourdissent le thème.

Approche

Trois mécaniques distinctes, chacune adaptée à un contexte : • Dans le drawer panier, des recommandations via l’API Shopify Product Recommendations, avec un produit de repli configurable par metafield. • Sur la fiche produit, un duo « Complétez votre tenue » : un second produit et une remise définis par metafield, ajoutés au panier en un clic. • Des packs multi-produits avec sélection de variantes groupée, pour les gammes qui s’y prêtent. Les trois s’appuient sur des metafields et l’API panier native, sans app de bundle ou de cross-sell tierce.

Trois étages d’upsell natifs

Décisions

Pourquoi ces choix techniques

Les apps tierces font sortir les données du panier de Shopify et ajoutent une dépendance et un coût récurrent. Une Function reste native, exécutée côté Shopify, avec des règles testables et la donnée qui reste dans l’écosystème du projet.

Client

Jean Maisonnial

Head of E-Commerce · Wise Trail Running

« Tony nous a accompagné dans la création de notre thème Shopify sur mesure. Nous avons maintenant à disposition un thème optimisé avec plein de sections réutilisables pour l’avenir de notre marque Wise »

Suite

Un projet Shopify outdoor similaire ?

Theme custom, Cart Transform, Flow et parcours produit pensés pour convertir, livrés pour rester maintenables.