C cenaly.com
Commencer gratuitement

Commande en ligne sur votre site

Boutons « Ajouter au panier » et prise de commande intégrés à votre site existant

12 min read Ouvrir cet écran dans la démo
On this page 10

Commande en ligne sur votre site

Le widget « Commande en ligne » ajoute la prise de commandes à un site que vous avez déjà. Rien à migrer ni à remettre en page : le widget lit les pages de votre site, y place des boutons « Ajouter au panier » et gère le panier et la validation de commande par-dessus votre mise en page.

Où : Marketing → « Mon site » → fiche « Commande en ligne » → roue dentée. Le code d'installation est commun à tous les widgets, voir Mon site.


Quatre modes de fonctionnement#

Mode Ce que voit le visiteur Quand le choisir
Vitrine dédiée Un bouton « Commander » ; au clic, votre vitrine s'ouvre avec le menu et le panier par-dessus la page Site vitrine, page de destination, blog — aucun produit sur les pages
Par-dessus le site Nos boutons « Ajouter au panier » directement dans votre mise en page — sur la fiche produit et dans le catalogue, panier dans un coin de l'écran Le site a déjà un catalogue de produits, mais pas de prise de commandes (ou elle n'est pas pratique)
Remplacer les boutons Idem, plus les boutons « acheter » natifs et le panier du site masqués Vous voulez que toutes les commandes passent uniquement par nous
Interception complète Le site semble intact : les boutons restent natifs, mais leur clic envoie le produit dans notre panier, le passage au panier du site ouvre le nôtre, et les compteurs et montants affichent nos chiffres La vitrine est déjà bien mise en page — vous ne voulez pas changer son apparence, mais les commandes et les prix doivent être les nôtres

Analyse du site#

Tous les modes, sauf « vitrine dédiée », fonctionnent à partir d'une carte du site : où se trouvent sur vos pages le nom du produit, le prix, l'image, le bouton d'achat natif et le panier natif.

La carte est construite par le scanner : indiquez l'adresse et cliquez sur « Analyser le site » — généralement 1 à 3 minutes. En détail :

  1. Préréglages de plateformes — un jeu de sélecteurs prêt à l'emploi existe pour huit plateformes : WooCommerce, Shopify, Magento, PrestaShop, Bitrix, InSales, Tilda, OpenCart. Le scanner reconnaît aussi Ecwid, Squarespace et Wix à leur empreinte, mais il n'y a pas de préréglage pour eux — la carte est construite par analyse IA ;
  2. Analyse IA de la mise en page — pour les sites développés sur mesure et les thèmes non standard ;
  3. Vérification de chaque sélecteur trouvé sur des pages réelles ; les données sont comparées au balisage produit. Un sélecteur non vérifié n'entre pas dans la carte — mieux vaut moins de boutons qu'un bouton au mauvais endroit.

Le résultat affiche : la plateforme identifiée, le nombre de pages analysées, un exemple de produit reconnu et, séparément, la page produit et les fiches du catalogue. La carte est appliquée par un bouton et enregistrée avec les réglages du widget. Le site a changé — relancez simplement l'analyse.


Placement des boutons et apparence#

Cela se configure sur des maquettes avec aperçu en direct — une page produit type et le catalogue :

  • Bouton sur la page produit : sous le prix, à côté du bouton natif du site, flottant en bas de l'écran ou désactivé (le scénario principal de l'« interception complète » — pas de bouton dédié, le visiteur clique sur le bouton natif) ;
  • Bouton dans la fiche du catalogue : par-dessus la fiche, sous la fiche ou désactivé ;
  • Bouton du panier : dans n'importe lequel des quatre coins de l'écran ;
  • Couleur des boutons et texte (« Ajouter au panier », « Commander », personnalisé) — le libellé peut être défini séparément pour chaque langue de votre site.

Vos propres prix#

Un interrupteur distinct : le widget recalcule le prix de votre site dans le sien et l'affiche au visiteur — sur la page produit, dans le catalogue et dans le panier.

  • Règle de base pour tous les produits : pourcentage, majoration en devise, limites « pas en dessous / pas au-dessus » et arrondi (à l'entier, terminaison …9, centimes .99, dizaines rondes …0, multiple de 10/50/100).
  • Remplacements ponctuels par adresse de page, nom ou référence : prix dédié, règle dédiée, autre nom dans le panier ou « retiré de la vente » — dans ce cas, le bouton n'est pas placé.
  • Options d'affichage : ancien prix barré à côté du nouveau, libellé du type « prix promotionnel », libellé de devise personnalisé, emplacements de prix supplémentaires (panneau fixe, bloc « produits similaires »). Le recalcul des prix directement dans le balisage du site peut aussi être désactivé : le visiteur verra le prix du site, mais c'est le vôtre qui partira dans le panier.
  • Dans le compte, un aperçu « avant → après » sur un exemple de prix issu de votre site.

⚠️ La réécriture est visuelle : le backend de votre site n'a pas connaissance du nouveau prix. C'est pourquoi vos propres prix n'ont de sens qu'avec l'interception de commande — sinon, un visiteur qui clique sur un bouton natif resté en place passera commande à l'ancien prix, en dehors de vous. En mode « Interception complète », vos propres prix sont activés par défaut, et l'administration vous avertit si vous les avez activés sans interception.


Ce qui se passe après la commande#

Le visiteur ajoute des produits au panier, l'ouvre et valide sa commande — nom, téléphone, livraison ou retrait sur place avec adresse, commentaire. La commande arrive dans la section « Commandes » du compte, au même titre que les commandes de la vitrine, de la caisse et des agrégateurs : mêmes statuts, notifications, impression et transmission en cuisine. Il n'y a pas de « boîte de réception du widget » séparée. Chaque ligne de commande arrive avec un lien vers la page de votre site depuis laquelle le produit a été ajouté au panier — l'opérateur voit ce qui a été commandé.

Tout le reste concernant la commande en ligne se configure au même endroit, dans la fenêtre modale du widget : elle est organisée en accordéon avec les sections « Widget sur votre site », « Prise de commandes », « Livraison et retrait sur place », « Paiement », « Validation de commande » et « Fiscalisation des reçus » — les mêmes formulaires que dans les sections correspondantes du compte, réunis au même endroit.


Bouton « Me prévenir du retour en stock »#

Le deuxième tag, distinct, du même widget — pour la page d'un produit épuisé sur votre site. Le visiteur clique sur le bouton, laisse son e-mail, le confirme via le lien reçu par e-mail et reçoit un e-mail lorsque le produit est de nouveau en stock ; dans l'e-mail de confirmation, à côté de « confirmer », il y a aussi « refuser ». Les notifications sont envoyées par le même mécanisme que l'abonnement « me prévenir du retour en stock » sur notre Vitrine — aucun second mécanisme n'est créé.

Comment l'activer : dans la fenêtre des paramètres de commande en ligne, ouvrez la fiche « 🔔 Me prévenir du retour en stock », choisissez un produit et, le cas échéant, une variante de votre catalogue publié — le générateur assemblera le code. Sur la page du produit, placez un bouton avec l'attribut data-cenaly-stock="<товар>" (un exemple prêt à l'emploi figure dans la même fiche) et insérez une fois le tag stock/v1.js. Le déclencheur pèse moins d'un kilooctet et ne sait faire qu'une seule chose — attendre un clic ; le formulaire d'abonnement, les dictionnaires et l'envoi arrivent dans un fichier séparé, uniquement après l'action du visiteur.

Ce qu'il faut savoir :

  • Le produit est associé manuellement. Nous ne rapprochons pas un catalogue tiers et ne lisons pas les stocks d'une page tierce : « de retour en stock » signifie la disponibilité dans votre catalogue chez nous, celle que voit notre Vitrine. Un produit absent du catalogue publié de l'Établissement ne sera pas accepté par le bouton.
  • L'abonnement est confirmé par e-mail (double opt-in) : tant que le lien de l'e-mail n'a pas été cliqué, aucun e-mail de retour en stock n'est envoyé.
  • L'abonnement ne réserve pas le produit. La notification est envoyée lors du retour en stock dans notre catalogue. Dans la version actuelle, une adresse e-mail est prise en compte une seule fois par produit : un nouvel abonnement à une autre variante du même produit ne remplace pas la variante déjà choisie.
  • Avec une CSP stricte, uniquement avec un nonce : le formulaire d'abonnement ne s'ouvrira pas sans autorisation supplémentaire des scripts CDN ou une politique 'strict-dynamic' adaptée : détails dans « Mon site ».
  • Ce n'est pas un tag unique. Le chargeur unique de « Mon site » ne prend pas en charge le bouton « Me prévenir du retour en stock » — il a son propre tag et son propre balisage sur la page, car il ne se trouve que là où vous l'avez placé.

Limitations#

  • Le Scanner lit le HTML côté serveur. Si le catalogue est entièrement rendu en JavaScript, les pages produit peuvent ne pas être trouvées — dans ce cas, le mode « Votre Vitrine » fonctionne.
  • Les produits du panier sont repris des pages de votre site, et non du catalogue du Compte : le widget lit le nom et le prix directement sur la page (et les recalcule si nécessaire selon votre règle de prix). Il n'est pas nécessaire de transférer le catalogue chez nous pour cela — mais ces commandes ne déduisent pas non plus les stocks du Compte.
  • Dans le panier du widget, il est possible de choisir le paiement à la réception ou le paiement en ligne, si un prestataire pris en charge est configuré pour l'Établissement. Après la création de la commande, le visiteur est redirigé vers la page du prestataire ; le widget lui-même ne reçoit pas les données de carte. Si la préparation du paiement a échoué, il est possible de la relancer pour une commande déjà créée.
  • En mode « Remplacer les boutons », les boutons d'origine sont masqués visuellement ; si le site comporte un autre chemin vers la commande (par exemple, un lien direct vers un panier tiers), il faut le supprimer vous-même — ou passer en mode « Interception complète », qui prend en charge ces redirections.

Dépannage#

Les boutons « Ajouter au panier » ne sont pas sur le site.

  1. Tag introuvable — cliquez sur « Vérifier l'installation » dans la section « Mon site ». « Code absent » — le tag n'est pas inséré ou ne figure pas sur toutes les pages du modèle ; « code d'un autre Établissement » — le tag contient un data-domain tiers. Si le tag est inséré via Google Tag Manager, la vérification ne le verra pas : inspectez le site à l'œil.
  2. Les modifications ne sont pas encore arrivées — les fichiers des widgets sont diffusés via CDN avec un cache de 5 minutes : attendez et actualisez la page en vidant le cache.
  3. Le plan du site n'est pas généré ou pas appliqué — dans les modes autres que « Votre Vitrine », les boutons sont placés selon le plan : scannez le site et appliquez le résultat.
  4. Le Scanner n'a pas trouvé les pages produit — il lit le HTML côté serveur ; si le catalogue est entièrement rendu en JavaScript, passez au mode « Votre Vitrine ».
  5. Le bouton sur la page produit est désactivé dans les paramètres de placement — c'est voulu dans le scénario « interception complète », où le visiteur clique sur le bouton d'origine du site.

Le bouton du panier a disparu. Vérifiez le coin de l'écran choisi dans les paramètres de placement ; si le multibouton est activé et que son éventail contient l'élément « Commander », le bouton propre du widget est volontairement désactivé.

Les boutons se sont placés au mauvais endroit ou ont disparu après une mise à jour du site. La mise en page a changé — cliquez sur « Rescanner » : les paramètres de placement sont conservés.

Les prix sur la page n'ont pas changé. Le réaffichage des prix directement dans le balisage du site peut être désactivé par un paramètre — le visiteur voit alors le prix du site, et c'est le vôtre qui part dans le panier. Vérifiez aussi que la règle de prix est activée et qu'il n'existe pas de redéfinition ponctuelle pour ce produit.

Le visiteur a passé une commande sur le site, mais la commande n'est pas dans le Compte. Très probablement, la commande est passée sans nous — via un bouton d'origine resté actif ou un lien direct vers le panier du site. Cela se règle avec le mode « Remplacer les boutons » ou « Interception complète ».

Le prix dans la commande n'est pas le bon. La réécriture des prix est visuelle : le backend de votre site ne la connaît pas. Il est judicieux d'activer vos propres prix uniquement avec l'interception de la commande — sinon une partie des commandes sera passée à l'ancien prix sans passer par vous.


Sections associées#


Questions fréquentes#

Faut-il transférer le catalogue chez vous ? Non. Le Widget fonctionne avec les produits directement sur les pages de votre site : il y lit les noms et les prix. Le catalogue dans le Compte est nécessaire si vous souhaitez une gestion de stock, des analyses par Article et notre Vitrine : le transfert peut se faire par import à l'adresse du site ou par fichier — voir Import de catalogue AI et Boutique en ligne.

Que se passe-t-il si le site a changé ? Cliquez sur « Relancer l'analyse » — la carte sera mise à jour, les paramètres de placement seront conservés.

Le Widget va-t-il casser la mise en page ? Les boutons sont insérés aux emplacements trouvés dans votre balisage, l'apparence se configure ; le panier et la commande s'ouvrent par-dessus la page et ne touchent pas à votre mise en page.

Was this article helpful?