Un vrai calcul de frais de port
Remplacer une whitelist de codes postaux par un appel API Shopify réel.
2026
Twood
Twood (Séguin Moreau) · Intégration et développement métier (panier, livraison, checkout B2B) sur thème premium · Personnalisation thème Reformation + estimateur de livraison
Contexte
Twood, marque de barriques et solutions d’élevage en chêne français de Séguin Moreau, vend en B2B et B2C sur Shopify, sur une base du thème premium Reformation (Fuel Themes). Je suis seul contributeur sur ce projet, concentré sur le parcours panier et livraison, pas sur le design global du thème.
L’estimateur de livraison remplaçait une whitelist de codes postaux par un vrai appel à l’API panier Shopify (pays et code postal vers tarifs), avec retries et affichage du prix TTC, sur la page panier comme dans le drawer. Le bouton de commande ne s’active que si un tarif est calculé et les CGV cochées, avec un observer DOM pour cohabiter avec l’app BSS B2B qui réécrit elle-même ce bouton.
Livré en mars 2026, aux côtés de correctifs panier, SEO et mise en conformité RGPD sur le formulaire d’inscription B2B.
Objectifs & livrables
Un checkout conditionnel fiable
Bouton de commande actif seulement si un tarif est calculé et les CGV cochées.
Cohabiter avec BSS B2B
Un observer DOM pour ne pas entrer en conflit avec l’app qui réécrit le bouton.
Rester conforme RGPD
Mentions et pays par défaut sur le formulaire d’inscription B2B.
Sous le capot
Shopify Online Store 2.0 sur le thème Reformation v9. Liquid, JavaScript en Web Components, CSS, templates JSON. Web Component zip-code-form connecté aux APIs Shopify prepare_shipping_rates et async_shipping_rates, sélecteur de pays alimenté par les zones Shopify (country_option_tags). Coexistence avec l’app BSS B2B Solution.
Shipping API
Estimateur de livraison : de la whitelist à l’API
Un Web Component qui interroge l’API panier Shopify pour calculer un vrai tarif de livraison, plutôt qu’une liste de codes postaux à maintenir à la main.
Checkout
Checkout conditionnel, sans casser BSS B2B
Le bouton de commande ne s’active qu’avec un tarif calculé et les CGV cochées, sans entrer en conflit avec l’app B2B qui réécrit ce même bouton.
RGPD
Marchés, pays et conformité B2B
Un sélecteur de pays alimenté par les zones Shopify, et un formulaire d’inscription B2B conforme RGPD.
Shipping APIWeb Components
01 / 03
Estimateur de livraison : de la whitelist à l’API
Problème
Une whitelist de codes postaux ne reflète ni les zones Shopify réelles ni les tarifs à jour, et doit être maintenue manuellement à chaque changement.
Approche
Un Web Component zip-code-form interroge les APIs Shopify prepare_shipping_rates et async_shipping_rates avec le pays et le code postal, avec gestion des retries et de l’annulation si l’utilisateur change sa saisie. Le prix TTC s’affiche directement, avec la même logique sur la page panier et dans le drawer.
Estimateur de livraison : de la whitelist à l’API
CheckoutB2B
02 / 03
Checkout conditionnel, sans casser BSS B2B
Problème
Bloquer la commande tant qu’un tarif de livraison n’est pas connu et que les CGV ne sont pas acceptées, sur une page où une app tierce (BSS B2B) manipule aussi ce bouton.
Approche
Un observer DOM surveille les changements apportés par l’app BSS B2B pour réappliquer la condition d’activation du bouton, sans entrer en conflit avec elle ni dupliquer sa logique.
Checkout conditionnel, sans casser BSS B2B
RGPDMarkets
03 / 03
Marchés, pays et conformité B2B
Problème
Garder le sélecteur de pays cohérent avec les zones de vente réellement configurées dans Shopify, et mettre le formulaire d’inscription B2B en conformité RGPD.
Approche
Le sélecteur de pays est alimenté par les zones Shopify, avec un pays par défaut pour un client déjà connecté et des correctifs sur la liste affichée. Le formulaire d’inscription BSS B2B a été mis à jour avec les mentions RGPD requises et la France en pays par défaut à l’inscription.
Marchés, pays et conformité B2B
Décisions
Pourquoi ces choix techniques
Non, le thème premium Reformation (Fuel Themes) était déjà en place. Mon travail a porté sur le parcours panier, livraison et checkout.
Projets
Autres réalisations.
2026
Näak
Boutique Shopify Plus pour Näak, marque de nutrition et d’hydratation ultra-trail partenaire de l’UTMB® World Series. Refonte produit, abonnements et déploiement multi-marchés.
2026
Slicy
Thème Shopify OS 2.0 écrit from scratch pour Slicy, protections et stickers vélo sur-mesure : configurateur de matching et personnalisation SVG en direct.
2026
GoodBro
Migration WooCommerce vers Shopify pour GoodBro, animalerie en ligne : 760 produits, 37 130 commandes, 1 177 abonnements, zéro email client.
Suite
Un flux panier/livraison à fiabiliser sur un thème premium ?
Pas besoin de tout reconstruire : le bon custom métier au bon endroit suffit souvent.