--- title: "Widget d’abonnement : documentation Subscriptions" description: "Ajoutez le widget d’abonnement Chargezen à vos pages produit Shopify, choisissez un modèle, réglez ses textes et son apparence, et ajoutez des offres avant l’ajout au panier." url: "https://chargezen.com/fr/docs/subscriptions/subscription-widget" lang: "fr" updated: "2026-10-18" --- Canonical URL: https://chargezen.com/fr/docs/subscriptions/subscription-widget # Widget d’abonnement Ajoutez le widget d’abonnement Chargezen à vos pages produit Shopify, choisissez un modèle, réglez ses textes et son apparence, et ajoutez des offres avant l’ajout au panier. Dernière mise à jour : 2026-10-18 Le widget d’abonnement est le bloc d’achat de vos pages produit : les acheteurs y choisissent entre achat unique et abonnement, sélectionnent une fréquence de livraison et ajoutent au panier. C’est là que commencent la plupart des abonnements : il vaut donc la peine de le rendre clair. Ouvrez **Subscriptions → Customer experience → Subscription widget**. ## Configurer 1 #### Créer un widget Choisissez **Create widget**, puis **Use template** sur **Product widget** (un bloc d’achat compact pour toute page produit) ou **Variant cards** (des cartes de variantes, en achat unique ou en abonnement, et des offres avant l’ajout au panier). 2 #### Modifier les textes et l’apparence Parcourez les sections de l’éditeur (Content, Layout, Behavior, Style et d’autres). Utilisez **Previewing** pour choisir un produit, et les boutons ordinateur et mobile pour vérifier les deux tailles. 3 #### Choisir où il s’affiche Dans **Publish**, saisissez un **Widget name** (vous seul le voyez) et réglez **Show on** sur **All products** ou **Specific products**. 4 #### Enregistrer Choisissez **Save**. 5 #### Ajouter le bloc à votre thème Sous **On your store**, choisissez **Add the block in Shopify**. Dans Shopify, ouvrez **Online Store → Themes → Customize**, ouvrez un modèle de produit, ajoutez le bloc **Chargezen product widget** ou **Chargezen variant cards**, puis enregistrez le thème. Partir d’un plan Dans la carte **Storefront widget** d’un plan, **Customize widget** ouvre le widget des produits de ce plan, ou en crée un nouveau. ## Options du Product widget * **Content** : le texte des boutons (Add to cart, Buy now), le titre et le sous-titre de l’option d’achat unique, le titre, le sous-titre et le **Delivery selector label** de l’option d’abonnement, et le libellé de quantité. Au départ : « One-time purchase », « Subscribe and save » et « Pause, skip, or cancel anytime. » * **Layout** : afficher ou masquer le fournisseur, le titre du produit, le prix, le sélecteur de variante, les options d’achat unique et d’abonnement, le sélecteur de livraison, le sélecteur de quantité, Add to cart et Buy now. * **Behavior** : **Selected by default** (Auto, One-time ou Subscription), **Shown first**, les limites de quantité, et si le widget affiche les médias de la variante ou met à jour l’image produit du thème. * **Rules** : **Allow preorders** avec une fenêtre de confirmation, **Confirm before purchase** avec un message d’avertissement, **Discount this product** avec un libellé et un pourcentage de réduction, et **Offer all variants as a bundle**. * **Style** : couleurs et texte des boutons, couleurs du texte, couleurs de sélection, surfaces et bordures. ## Options des Variant cards * **Content** : les cartes d’achat unique et d’abonnement, le texte des boutons, la mention « épuisé » et le symbole de la devise. Dans le titre de l’abonnement, `{{savings}}` est remplacé par le montant économisé. * **Layout** : les prix, les cartes de variantes et les colonnes, et quelles cartes et quels boutons s’affichent. * **Offers** : ajoutez **Bundle (try them all)**, **Upsell**, **Buy more**, **Sell as another variant** ou **Preorder**. Chacune a un bouton **Show this offer** et reste désactivée tant que ses champs obligatoires ne sont pas remplis. Une vente incitative refusée peut proposer une autre offre, ou rien. * **Variants** : triez les cartes du prix le plus bas au plus haut, du plus haut au plus bas ou dans un ordre personnalisé ; renommez une variante, masquez-la ou affichez-la comme épuisée. * **Behavior** : **Selected by default** ; Auto sélectionne l’abonnement sur les liens /start et /pay, et l’achat unique partout ailleurs. * **Style** et **Custom CSS** : couleurs, coins, typographie, et du CSS chargé après les styles propres au widget (commencez les sélecteurs par `#ketonaid-widget`). ## Quel widget utilise un produit Un widget réglé sur **All products** s’affiche sur tous les produits, sauf ceux qui ont leur propre widget. Quand plusieurs widgets spécifiques incluent le même produit, c’est la **Priority** la plus élevée qui l’emporte. La liste des widgets affiche pour chacun **Type**, **Template**, **Status**, **Scope** et **Offers**. Utilisez **Filter** pour afficher les widgets All, Active ou Draft, et le menu de la ligne pour **Edit** ou **Delete**. ## Dépannage ### Le widget ne s’affiche pas sur ma page produit * Vérifiez que le bloc est ajouté au modèle de produit que vous utilisez et que vous avez enregistré le thème. * Vérifiez que le widget est réglé pour s’afficher sur ce produit, ou sur All products. * Vérifiez qu’aucun autre widget incluant ce produit n’a une priorité plus élevée. ### Le widget s’affiche, mais pas mon option d’abonnement * Le plan doit être Active, inclure le produit et avoir le canal **Online Store** activé. Aucun widget ne propose un plan retiré de l’Online Store. * Ajoutez des produits au plan pour que les acheteurs puissent s’abonner depuis leurs pages produit. ### Le widget ne s’enregistre pas Donnez un nom au widget, et choisissez au moins un produit ou affichez-le sur tous les produits. ## À lire aussi * [Ventes incitatives et ventes croisées](https://chargezen.com/fr/subscriptions/upsells-and-cross-sells) : transformez les acheteurs ponctuels en abonnés. * [Débuter avec les abonnements](https://chargezen.com/fr/subscriptions/getting-started) : lancez votre premier programme. * Glossaire : [abonnez-vous et économisez](https://chargezen.com/glossary/subscribe-and-save), [page produit](https://chargezen.com/fr/glossary/product-detail-page), [ajout au panier](https://chargezen.com/fr/glossary/add-to-cart). ### Articles liés [ #### Créer des plans d’abonnement Les plans que propose le widget ](https://chargezen.com/fr/docs/subscriptions/create-product)[ #### Fonctionnement des plans de vente Pourquoi le canal Online Store compte ](https://chargezen.com/fr/docs/subscriptions/selling-plans-explained)[ #### Lots en box sur mesure Une box que les clients composent eux-mêmes ](https://chargezen.com/fr/docs/subscriptions/build-a-box) Cette page vous a-t-elle été utile ? Besoin d’aide ? [Contacter l’assistance](https://chargezen.com/docs/checkoutos/troubleshooting/support)