Booxi est intégré à Shopify ! Cette intégration a été conçue pour simplifier la création et la gestion des CTAs (appels à l'action), tout en améliorant l'expérience de vos clients. L'intégration permet les éléments suivants :
Création, stockage et gestion des CTA (par exemple le bouton « Réserver maintenant ») qui redirigent vers le booking widget.
Configuration et personnalisation du booking widget.
Capture de paiement à l'aide du processus de paiement Shopify (les services réservés par les clients dans Booxi sont automatiquement ajoutés à leur panier d'achat dans Shopify).
Ajout automatique de nouveaux clients dans Shopify
Installation
Pour installer l'intégration, il suffit de rechercher Booxi dans le magasin d'applications de Shopify et de l'installer.
Configurez vos paramètres
Pour configurer vos paramètres, naviguez vers l'onglet « Applications » > Booxi > Paramètres :
Entrez les champs suivants :
Région d'hébergement*
Amérique du Nord
Europe
Si l'URL de votre compte Booxi se termine par « .com », votre région d'hébergement est l'Amérique du Nord. Si elle se termine par « .eu », votre région d'hébergement est l'Europe.
Clé API partenaire (facultatif) : obligatoire si vous souhaitez activer l'une des 2 fonctionnalités suivantes, sinon non :
Mise à jour automatique du statut de paiement de la réservation Booxi lorsqu'un article est payé depuis Shopify (voir ici)
Pour obtenir une clé API partenaire, contactez votre représentant Booxi
La clé API partenaire fournie doit être associée à la clé API magasin que vous entrez ci-dessous.
Clé API magasin* [par défaut] : cette clé est utilisée pour spécifier quel(s) magasin(s) le booking widget présentera à l'ouverture. La clé se trouve dans l'onglet « Mon Entreprise » > Détails de l'entreprise.
Une fois vos paramètres configurés, vous êtes prêt à créer des CTA.
Comment créer un CTA
Pour créer un CTA, entrez les informations suivantes :
Clé API du magasin* : cette clé est utilisée pour spécifier le magasin(s) que le booking widget présentera à l'ouverture. La clé se trouve dans l'onglet « Mon Entreprise » > Détails de l'entreprise.
Vous pouvez utiliser votre clé API magasin par défaut ou une autre.
Nom CTA* : le titre de votre CTA.
Paramètres
Activer le magasin sélectionné : configure le widget de telle sorte qu'à l'ouverture, la liste de vos magasins s'affiche (au lieu d'un seul magasin). Le client sera invité à sélectionner un magasin dans la liste.
Entrez une étiquette de filtre de magasin (utilisez des virgules pour l'opérateur ET): filtre la liste des magasins affichés dans le widget (pertinent si vous avez plusieurs magasins).
Pour appliquer une étiquette à un magasin, naviguez vers l'onglet « Mon entreprise » > Détails de l'entreprise > Étiquettes de filtre pour la réservation. Pour plus d'informations, voir ici.
Entrez une étiquette de filtre de service (utilisez des virgules pour l'opérateur ET) : filtre la liste des services affichés dans le widget.
Pour appliquer une étiquette à un service, naviguez vers l'onglet « Services » > {sélectionner un service} > Détails du service > Étiquettes de filtre pour la réservation. Pour plus d'informations, voir ici.
Entrez un ID de catégorie de service: présélectionne une catégorie de service spécifique lors de l'ouverture du booking widget. Pour obtenir l'ID d'une catégorie de service, naviguez vers l'onglet « Services » > {cliquez sur l'icône en forme de crayon à côté d'une catégorie de service} > notez l'ID sous « Détails de la catégorie »
Entrez un ID service : présélectionne un service spécifique lors de l'ouverture du booking widget. Pour obtenir l'ID d'un service, naviguez vers l'onglet « Services » > {sélectionnez un service} > notez l'ID sous « Détails du service ».
Événement
Entrez une date d'événement : Ouvre le widget à une date spécifique.
Entrez un ID d'événement : Ouvre le widget à un événement spécifique (c'est-à-dire un rendez-vous ou un événement de groupe).
Identifiant de produit personnalisé
Insérer une variable produit ({Product.ID} ou {Product.Name}). Cette information sera incluse dans le champ « Demande supplémentaire du client ». Ceci peut être utile si vous avez plusieurs services qui redirigent vers la même URL de panier d'achat; ceci vous permettra d'identifier rapidement le produit correspondant.
Vous pouvez récupérer cette information dans le rapport de rendez-vous (voir la colonne « Client request »).
Redirection d'URL : redirige vers une autre page après la fermeture du booking widget.
URL si la réservation a été effectuée avec succès
URL si la réservation a été annulée
Si vous avez activé le paiement par panier, laissez ce champ vide.
Analytique
Personnalisez votre CTA
Texte du CTA
Couleur d'arrière-plan
Couleur du texte
Border-radius
Langue : la langue dans laquelle le booking widget sera présenté.
*Note : si aucune langue n'est sélectionnée, la langue par défaut du navigateur s'appliquera.
Session utilisateur
« Utiliser la session utilisateur existante » : si cette option est cochée, l'application Shopify transmettra les coordonnées du client au Booking Widget pour pré-remplir les informations client en fonction de la session en cours.
« Ignorer le formulaire d'identification client du Booking Widget » : si cette option est cochée, l'étape d'identification du client sera sautée (c'est-à-dire que le client n'aura pas besoin d'entrer ses informations lors de la réservation).
*Note : s'il manque des informations, l'étape d'identification du client ne sera pas sautée.
Vos CTAs seront affichés dans la page « Liste CTA ».
Comment ajouter un CTA à une page
Une fois vos paramètres configurés, vous pouvez ajouter le CTA à votre boutique Shopify. Les CTA Booxi peuvent être ajoutés à n'importe quel élément qui autorise les applications. Par exemple, dans une page du site (c'est-à-dire dans l'en-tête, le corps ou le pied de page) ou sur une page produit.
Naviguez vers l'onglet « Applications » > Booxi > Liste CTA, puis copiez le shortcode d'un CTA.
Ensuite, ouvrez l'éditeur de votre boutique en ligne et naviguez jusqu'à la page souhaitée.
*IMPORTANT : vous devez activer la bascule Booxi dans l'écran « Intégrations d’application » pour que le widget fonctionne.
Exemple 1 : sur la page d'accueil
Ouvrez votre boutique en ligne.
Naviguez jusqu'à votre page d'accueil.
Cliquez sur « Ajouter une section ».
Cliquez sur « Applications », sélectionnez Booxi.
Cliquez sur l'option Booxi CTA, puis entrez le shortcode.
Cliquez sur le bouton pour le tester.
Exemple 2 : sur une page produit
Naviguez vers votre section « Produits » .
Sélectionnez un produit.
Dans la section appropriée (par exemple « Modèle »), cliquez sur « Ajouter un bloc » (Ajouter un bloc).
Cliquez sur « Applications », sélectionnez Booxi.
Cliquez sur l'option Booxi CTA, puis entrez le shortcode.
Cliquez sur le bouton pour le tester.
Processus de paiement Shopify
Ajouter automatiquement les services réservés au panier du client lors de la réservation en ligne.
Pré-requis
Activez le paramètre « Activer le paiement en ligne via le panier d’achats » (onglet « Mon entreprise » > Règles de réservation).
Dans le champ « URL d’ajout au panier d’achats », entrez l'URL de votre site web Shopify.
Pour chaque service pour lequel vous souhaitez activer le paiement par panier, définissez leur méthode de paiement en ligne sur « Panier d'achats » : naviguez vers l'onglet « Services » > {sélectionner un service} > Détails du service. Sous « Paiement en ligne », sélectionnez « Panier d'achats » et définissez un prix.
*Note : le prix facturé au client sera celui indiqué dans Shopify. Pour éviter toute confusion, veuillez vous assurer que le prix indiqué dans Booxi correspond au prix indiqué dans Shopify. Cela signifie également que si vous modifiez le prix du produit dans Shopify, vous devez également le modifier dans Booxi.
Dans le champ « Numéro de produit pour panier d’achats », entrez l'ancre de l'URL
Shopify de votre produit ; pour y accéder, naviguez vers l'onglet « Produits » dans Shopify > {sélectionnez un produit} faites défiler vers le bas jusqu'à « Ancre de l'URL », puis copiez la fin de votre URL, comme indiqué ci-dessous.
*Note : si vous modifiez l'ancre URL d'un produit dans Shopify, vous devrez la mettre à jour dans Booxi.
Comment fonctionne le paiement via le panier d'achat
Le client clique sur un CTA ; le widget s'ouvre.
Le client réserve un rendez-vous ou un événement de groupe.
Le client est redirigé vers le panier avec le produit correspondant ajouté.
Le client passe à la caisse.
Au moment du paiement, Shopify vérifie le status de la réservation ; si la réservation est annulée dans Booxi, le client ne pourra pas passer à la caisse.
Si le paiement est effectué avec succès, le client reçoit un reçu de Shopify.
Par défaut, les paiements effectués dans Shopify n'affectent pas le statut de leur paiement dans Booxi. Pour ce faire, vous devez entrer une clé API partenaire dans vos paramètres.
Notes
Notez que si le paramètre « Annuler automatiquement un rendez-vous non payé » (onglet « Mon entreprise » > Règles de réservation) est activé dans votre compte, les réservations qui ne sont pas payées dans les 15 minutes suivant le moment de réservation seront automatiquement annulées, ce qui empêchera les clients de compléter le paiement dans Shopify (après 15 minutes).
Toute modification/annulation de réservation effectuée dans Booxi n'affectera pas l'article du client dans Shopify.
Toute action du client dans Shopify n'affectera pas la réservation dans Booxi.
Les annulations de réservations payantes (effectuées par le client ou le personnel) ne déclenchera pas de remboursement dans Shopify. Les remboursements doivent être effectués manuellement dans Shopify.
Ajout automatique de nouveaux clients à Shopify
Nécessite une clé API partenaire.
Les nouveaux clients (obtenus à partir des réservations Booxi) seront automatiquement ajoutés à votre liste de clients Shopify ; Shopify effectuera une recherche par l'adresse courriel du client.
Autre
Vous pouvez consulter les commandes qui ont été automatiquement ajoutées à Shopify depuis Booxi en naviguant vers l'onglet « Commandes » dans Shopify.
Les articles ajoutés à partir des réservations Booxi incluront l'ID de réservation Booxi, l'ID de paiement et la date et l'heure associées.
Cette intégration s'applique au booking widget v3.