Icône de l'article Blog

Exploiter tout le potentiel de Shopify Functions

Image principale de l'article
Image principale de l'article

Cet article, initialement publié en mai 2024, a depuis été mis à jour pour tenir compte des nouvelles améliorations, des regroupements et des mises à niveau apportés aux Shopify Functions

Lorsque tout le monde utilise les mêmes plateformes et outils pour son commerce électronique, comment se démarquer?

Une alternative aux scripts de Shopify, Shopify Functions offre une personnalisation facile en vous permettant d'adapter le comportement de la page de paiement de votre site pour répondre aux préférences et aux scénarios spécifiques des clients. Ces bouts de code personnalisés améliorent le comportement de votre site et stimulent les ventes grâce à une réactivité en temps réel.

Dans ce guide, nous allons détailler toutes les fonctionnalités de Shopify Functions, en mettant l'emphase sur la façon dont elles améliorent les transactions, l'expérience des utilisateurs et, en fin de compte, augmentent le chiffre d'affaires de votre boutique grâce à des opérations en temps réel, côté serveur.

Qu'est-ce que Shopify Functions?

En remplacement aux Scripts de Shopify qui sont plus limités et bientôt désuets, Shopify Functions sont de petits bouts de code isolés que vous pouvez insérer dans l'infrastructure de Shopify pour personnaliser le comportement d'un panier d'achat donné sur une base de règles et d'éléments déclencheurs spécifiques. Elles permettent d'accéder au comportement natif de Shopify et de définir une logique commerciale personnalisée que Shopify exécutera pour le compte de votre boutique. 

L'un des avantages de Shopify Functions par rapport aux scripts est que les magasins peuvent avoir plusieurs Shopify Functions actives qui affectent la même commande et les mêmes lignes de produits, les lignes d'expédition et les lignes de paiement en même temps. Cette possibilité était auparavant impossible avec les scripts, ce qui fait de Shopify Functions le grand gagnant de ces deux méthodes de personnalisation.

Il est important de noter que Shopify Functions fonctionne exclusivement sur un serveur, ce qui signifie que les changements se produisent instantanément et ne nécessitent aucune intervention de la part de vos clients. Cette réactivité en temps réel se traduit par des transactions plus fluides, une meilleure expérience utilisateur et, en fin de compte, une augmentation du chiffre d'affaires.

Exemples de Shopify Functions

Il existe actuellement dix API de Shopify Functions que les développeurs peuvent utiliser pour ajouter des fonctionnalités/logiques supplémentaires à la page de paiement de leur site. Ces API couvrent différents cas d'utilisation pour l'ensemble de l'expérience de paiement de votre site, notamment la personnalisation du paiement, la validation du panier et du paiement, la personnalisation de la livraison, les rabais sur les produits, les commandes et les frais de port, la logique de personnalisation du traitement des commandes et la transformation du panier. 

Les utilisateurs de la version pilote du Checkout and Customer Accounts Extensibility peuvent également accéder à l'API Order Routing Location Rule et à l'API Discounts Allocator. 

Voici une présentation détaillée de chaque API de Shopify Functions actuellement disponible pour les marchands et de l'usage qu'ils peuvent en faire:

L’API Discount Function

Avant avril 2025, cette fonctionnalité était répartie en trois API distinctes : l’API Order Discount, l’API Product Discount et l’API Shipping Discount.

L’une des API les plus simples à utiliser, l’API Discount Function vous permet d’ajouter un nouveau type de rabais applicable à tous les articles, pour lequel vous pouvez intégrer votre propre logique d’affaires. Une fois votre nouveau type de rabais créé, vous pouvez en définir plusieurs instances selon vos besoins.

Par exemple, supposons que votre entreprise vende au Canada et aux États-Unis et que vous souhaitiez configurer un rabais en pourcentage sur le total du panier, applicable dans un seul marché et après qu'un certain seuil a été atteint. Plutôt que de devoir configurer un seuil global pour ce rabais comme l’exige la fonctionnalité native de Shopify, vous pouvez créer deux instances distinctes – une pour le marché américain et une autre pour le marché canadien. Vous pouvez ainsi gérer deux devises différentes sans dépendre du taux de change quotidien, ce qui facilite la cohérence de votre marketing et de votre site web.

Cette API est aussi idéale pour les promotions du genre « 2 pour 22 $ » que vous voudriez offrir uniquement sur le marché canadien. Si un client achète deux articles ayant la même étiquette, il obtient un prix réduit. Vous pourriez ensuite créer une version distincte de cette promotion pour vos clients américains en offrant un rabais similaire (par exemple, « 2 pour 20 $ ») afin de proposer un prix uniforme sur les deux marchés, éliminant ainsi la nécessité de gérer les fluctuations constantes des taux de change.

L'API vous permet également de créer des rabais qui s'appliqueront à un ou plusieurs de vos tarifs ou options de livraison disponibles au moment du paiement. Vous pouvez l'utiliser pour offrir la livraison gratuite, appliquer des rabais sur les tarifs – sous forme de valeur monétaire ou de pourcentage – ou encore cibler des tarifs spécifiques.

Par exemple, vous pourriez utiliser cette API pour ajouter un rabais de 25 % à votre option de livraison express pour les commandes passées durant la dernière semaine avant la période des Fêtes, au moment où les clients souhaitent recevoir leurs articles rapidement.

L’API Delivery Customization

Cette API permet de trier, de renommer et de réorganiser les options de livraison proposées à vos clients lors du paiement. Par exemple, vous pouvez utiliser cette API pour masquer certaines options de livraison dans un certain marché ou si la commande contient des articles surdimensionnés. 

Vous pouvez également utiliser cette option pour réorganiser les options de livraison de votre site en fonction des préférences de l'utilisateur ou même ajouter des messages aux titres des options de livraison afin de fournir des informations supplémentaires à vos clients au moment du paiement. 

L’API Payment Customization

Tout comme l'API Delivery Customization, l'API Payment customization vous permet de renommer, de réorganiser et de trier les méthodes de paiement proposées à vos clients sur votre page de paiement. Par exemple, vous pouvez afficher/masquer certaines options de paiement pour les clients résidant dans des pays spécifiques ou pour les paniers dont le total est supérieur ou inférieur à une valeur de votre choix. 

L’API Cart Transform

Cette API se situe un cran au-dessus de toutes les API de réduction mentionnées ci-dessus, car elle vous permet de modifier à la fois la tarification et le merchandising des articles du panier. Nous verrons plus loin un exemple plus détaillé de ce que cette API peut faire, mais l'API Cart Transform est essentiellement l'outil que vous pouvez utiliser pour créer des offres groupées en fusionnant automatiquement des articles et en appliquant un rabais ou en mettant à jour des articles pour modifier leur prix, leur titre ou même les images du produit. 

l’API Cart and Checkout Validation

L'API Validation permet aux développeurs de personnaliser la validation du panier et de la page de paiement en fonction de leurs besoins spécifiques - les options de paiements express sont incluses. Un cas d'utilisation de cette API pourrait être la fixation de limites de quantité afin que les scalpers ne puissent acheter plus d'une certaine quantité d'un même article (idéal pour les articles en édition limitée ou les produits dont les quantités disponibles sont limitées). 

Vous pouvez également utiliser cette API pour imposer une limite d'âge à certains produits, de sorte que les personnes n'ayant pas atteint un certain âge (18 ou 21 ans, par exemple) ne puissent pas acheter d'articles sur votre site, ou même restreindre la possibilité d'effectuer un achat si le client n'est pas un utilisateur connecté à votre site web.

L’API Fulfillment Constraints Function

Cette API donne aux développeurs la liberté de fournir leur propre logique pour la façon dont Shopify doit traiter et allouer une commande. Actuellement, cette API ne prend pas en charge les options de ramassage local, mais elle permet d'apporter des modifications à la page de paiement, aux abonnements et aux commandes provisoires. 

L'un des cas d'utilisation de cette API pourrait être de s'assurer que certains articles du panier sont expédiés à partir d'un emplacement spécifique si vous en avez plusieurs ou, au contraire, de s'assurer qu'ils sont expédiés à partir de n'importe quel emplacement de votre liste. Cela peut répondre à des cas d'utilisation courants de l'OMS, tels que le géofencing et la limitation de l'expédition fractionnée.

l’API Local Pickup Delivery Option Generator

Encore en version bêta et disponible uniquement sur demande, cette API permet aux développeurs de générer des options de ramassage local personnalisées disponibles lors du checkout, sur la base de règles personnalisées. 

Par exemple, vous pouvez utiliser cette API pour ajouter un prix ou un coût supplémentaire à une option de ramassage local par ailleurs gratuite si le panier contient des articles volumineux ou lourds que les employés du magasin auront du mal à emballer ou à traiter. 

L’API Pickup Point Delivery Option Generator Function

La plus récente API, offerte en accès anticipé sur demande uniquement aux marchands Shopify Plus, est l'API de fonction de génération d’options de livraison en point de collecte (Pickup Point Delivery Option Generator Function API).

Son fonctionnement est similaire à celui de l'API de génération d'options pour le ramassage local (Local Pickup Delivery Option Generator API). La différence est qu'elle vous permet de proposer des livraisons dans des points de collecte plutôt que dans vos propres magasins pour que les clients puissent y récupérer leurs articles.

Dans ce contexte, il est important de distinguer les deux :

  • Les points de ramassage locaux sont les succursales qui appartiennent au marchand ou qui sont exploitées par lui.

  • Les points de collecte sont des emplacements tiers, comme des dépanneurs ou des bureaux de poste.

Avec cette API, les développeurs peuvent exploiter les données associées, telles que l'adresse d'un emplacement, ses heures d'ouverture et les frais de ramassage, afin de générer les meilleures options de livraison pour les clients.

L’API Order Routing Location Rule

Grâce à cette API, actuellement en version bêta, les développeurs peuvent définir un classement par emplacement pour chaque article du panier au moment de l'acheminement de la commande, en créant des règles qui déterminent la manière dont Shopify recommande à l'administrateur de traiter les commandes.

Par exemple, vous pouvez classer les emplacements les uns par rapport aux autres, donner la priorité ou non aux emplacements en fonction de facteurs spécifiques, ou traiter les commandes à partir de l'emplacement disponible le plus proche. Cela peut avoir un impact sur la réduction des expéditions fractionnées, l'optimisation des stocks dans certains emplacements pendant les périodes de pointe et la liquidation des stocks de certains emplacements pendant les fermetures de magasins.

L’API Discount Allocator

Enfin, l'API Discount Allocateur, aussi en version bêta, permet aux utilisateurs de fournir leur propre logique pour le calcul des rabais et leur attribution à un panier donné. 

Parmi les cas d'utilisation possibles, on peut envisager de fixer un rabais maximum pour un panier donné (par exemple, pas plus de 100 $), de limiter le nombre de rabais pouvant être appliqués simultanément ou de n'appliquer les rabais qu'à l'article le moins cher ou le plus cher du panier. La fonction la plus demandée de cet API est la possibilité de cumuler plusieurs remises sur un même article, ce qui n'était pas possible auparavant avec Shopify. 

Maintenant que nous avons parcouru l'ensemble des API, voyons comment fonctionne Shopify Functions.

Comment fonctionne Shopify Functions?

Tout d'abord, il est important de noter que l'accès aux APIs Shopify Functions n'est disponible que pour les sites qui ont opté pour Checkout Extensibility. Bien que toute boutique puisse installer des applications publiques à partir de l'App Store de Shopify qui utilisent Shopify Functions, Shopify limite la possibilité de créer et d'installer des applications personnalisées à l'aide de ses API aux utilisateurs des plans Commerce Components et Shopify Plus. 

De plus, certaines API, comme Cart Transform et l'API Order Routing, ne fonctionnent pas pour les boutiques en dessous de l'offre Plus. 

Bien que le nombre de personnalisations possibles avec Shopify Functions soit presque infini, le concept sous-jacent est relativement simple. Les développeurs de Shopify peuvent écrire des fonctions dans n'importe quel langage de programmation qui supporte WebAssembly, comme JavaScript, Rust ou TypeScript. Tant qu'elles peuvent être exécutées en moins de 5 millisecondes, elles peuvent être utilisées n'importe où sur la page de paiement pour n'importe quel cas d'utilisation que les développeurs peuvent trouver et qui utilise les onze API de Shopify.

Ce qui est particulièrement pratique avec Shopify Functions, c'est que même si une personne ayant des compétences en développement devra les écrire, les entreprises n'auront pas à toucher au code pour interagir avec elles une fois qu'elles seront terminées. Tout peut être fait directement dans l'interface d'administration de Shopify, à condition que le développeur intègre une interface utilisateur Shopify App Bridge pour leur permettre d'interagir avec leur fonction directement dans le backend de leur boutique.

Par exemple, imaginons que vous souhaitiez créer une fonction qui regroupe automatiquement des articles spécifiques dans le panier et applique un rabais si une certaine condition est remplie. Par exemple, si vous êtes une marque de bien-être et qu'un client ajoute une paire de leggings, un soutien-gorge de sport et des poids de cheville à son panier, il remplit les critères de l'offre groupée "débuter avec le fitness". 

Un développeur pourrait utiliser l'API Cart Transform pour regrouper ces articles et ajouter une réduction de 20 % au coût total des trois articles, sans toucher aux autres articles du panier. 

Une fois l'interface utilisateur App Bridge mise en place, le propriétaire de la boutique peut se rendre dans son administration Shopify et créer ou supprimer autant d'offres groupées qu'il le souhaite. Ces offres groupées apparaîtront alors dans le panier du client sans qu'aucune étape supplémentaire ne soit nécessaire de leur côté. Tout cela se passe de manière transparente pour l'utilisateur final, qui voit la création de l'offre groupées dans le panier et l'application de la réduction de manière automatique et claire. 

Il s'agit non seulement d'un excellent moyen de créer et de proposer des offres groupées, mais aussi d'instaurer un sentiment de confiance à l'égard de votre entreprise, car elle montre qu'elle se soucie d'aider ses clients à économiser de l'argent, puisque les produits sont fusionnés dans le panier sans qu'ils sachent qu'ils constituaient une offre groupée au départ. 

Tirer le maximum de Shopify Functions

Bien que chaque site e-commerce puisse avoir une sélection unique de produits et d'objectifs, il y a quelques éléments universels à prendre en compte lorsque l'on décide quelles Shopify Functions mettre en place dans une boutique donnée. Voici comment tirer le maximum de ces API de Shopify.

Identifier les opportunités clés

Mettez toujours l'accent sur les éléments de votre site où des améliorations pourraient s'avérer très rentables. Les domaines les plus courants sont les suivants:

  • Les flux de paiement: Simplifiez le parcours d'achat pour minimiser les frictions et encourager les achats impulsifs.

  • Recommandations de produits: Augmentez la valeur moyenne des commandes en suggérant des articles complémentaires ou des best-sellers.

  • Frais d'expédition: Proposez des options de livraison flexibles qui répondent aux diverses contraintes budgétaires. Cela permet de fluidifier les opérations afin d'augmenter la rentabilité ou de minimiser les réapprovisionnements.

Vous pouvez optimiser vos efforts et apporter des changements significatifs en vous concentrant sur des points de contact à fort impact tout au long de votre processus de paiement. 

Lorsque vous pensez aux Shopify Functions, pensez en termes d'entrée et de sortie de la fonction, c'est-à-dire ce qui doit se produire pour déclencher l'exécution de votre fonction et ce qui se produit lorsqu'elle s'exécute. Cela vous aidera à construire mentalement et à visualiser ce que votre fonction doit faire et comment. 

Surveiller et mettre à jour

Ne vous contentez pas de mettre en place vos fonctions et de les oublier. Au contraire, évaluez en permanence leurs effets sur les performances de votre site. Suivez les taux de conversion, les interactions avec les clients et d'autres indicateurs pour déterminer les mises en œuvre réussies et trouver des points à améliorer.

Réévaluez et affinez régulièrement votre stratégie Shopify Functions en fonction des nouvelles connaissances et des tendances changeantes du secteur. Expérimentez de nouvelles approches et incorporez des tactiques éprouvées pour continuer à augmenter la croissance et la rentabilité de votre site.

Faire appel à une agence e-commerce

Bien que les Shopify Functions soient plus faciles et plus intuitifs à utiliser que les scripts de Shopify, vous aurez toujours besoin de compétences en programmation ou d'un développeur dans votre équipe pour créer vos propres applications plutôt que d'installer simplement des applications pré-fabriquées à partir de l'App store de Shopify. 

Shopify Functions dispose également de sa propre page dans le tableau de bord des partenaires, où votre agence peut consulter les entrées/sorties de sa fonction, voir combien de fois elle s'exécute et combien de temps elle dure. De cette façon, vous pouvez être sûr que si quelque chose ne va pas ou ne fonctionne pas comme prévu, votre agence pourra rapidement et facilement jeter un coup d'œil et résoudre les problèmes pour vous. 

Le fait d'avoir quelqu'un d'autre pour surveiller et résoudre les problèmes est un excellent moyen de rester au courant des problèmes ou des mises à jour sans avoir à tout gérer soi-même. 

Conclusion

L'utilisation de Shopify Functions permet de faciliter les transactions et d'offrir à vos clients une expérience d'achat plus personnalisée, ce qui, comme nous le savons tous, se traduit directement par une augmentation du chiffre d'affaires et une augmentation du nombre de clients qui reviennent. Allez plus loin et faites appel à une agence partenaire Shopify Plus pour personnaliser davantage votre page de paiement grâce à des fonctions spécialement conçues pour vous.

En tant qu'agence partenaire certifiée Shopify Plus, Blue Badger possède l'expérience et l'expertise nécessaires pour que votre page de paiement soit plus efficace. Que vous ayez besoin d'une personnalisation du backend avec Shopify Functions ou d'une application ou d'un thème personnalisé, nous pouvons nous assurer que l'expérience de paiement de votre site est belle et bien fonctionnelle. Contactez-nous dès aujourd'hui pour en savoir plus.