Comment activer le widget d'abonnement sur la boutique en ligne

Le widget est ce que vos clients utilisent pour choisir un abonnement ou un lot sur vos pages produit. Un seul widget affiche les deux : vos options d'abonnement et vos options de lot. Pour l'activer, cliquez sur Activer le widget sur la page Design, puis sur Enregistrer dans votre éditeur de thème. Il n'y a aucun code, code d'intégration ou extrait à coller.

Table des matières

• Présentation en vidéo
• Instructions pas à pas
• Où apparaît le widget
• Choisir un emplacement précis
• Afficher le widget sur d'autres pages
• Fenêtres d'ajout rapide et d'aperçu rapide
• PageFly et autres constructeurs de pages
• Configurer sur un thème non publié
• Dépannage
• Questions fréquentes
• Guides associés

Présentation en vidéo

Si vous préférez regarder plutôt que lire, cette vidéo montre l'activation de l'intégration d'application dans l'éditeur de thème. C'est ce réglage qu'Activer le widget active pour vous.

Instructions pas à pas

1. Dans votre admin Shopify, ouvrez Supr Bundles & Subscriptions et allez dans Design.
2. Si le widget n'est pas encore activé, vous voyez une bannière Vos widgets ne sont pas encore en ligne. Cliquez sur Activer le widget (dans la bannière ou en haut de la page).
3. Dans la fenêtre qui s'ouvre, cliquez sur Activer. Votre éditeur de thème s'ouvre dans un nouvel onglet avec Supr Bundle & Subscriptions activé dans Intégrations d'applications.

4. Dans l'éditeur de thème, cliquez sur Enregistrer en haut à droite. L'éditeur affiche un rappel One more step tant que vous ne l'avez pas fait. Si vous fermez l'éditeur sans enregistrer, le widget reste désactivé.

5. Revenez à l'onglet de l'application. Vous voyez Widget activé dès que l'application a détecté le réglage enregistré. S'il est indiqué Widget non activé, cliquez à nouveau sur Activer et veillez à cliquer sur Enregistrer cette fois.

Vous pouvez aussi commencer depuis Accueil : l'étape Widget activé du guide de configuration (ou Widget d'abonnement activé / Widget de lot activé, selon ce que vous vendez) a le même bouton Activer le widget. Une fois le widget activé, ce bouton devient Personnaliser le widget et vous emmène dans Design.

Où apparaît le widget

Il n'y a rien à faire glisser. Le widget se place de lui-même sur vos pages produit, juste au-dessus du bouton d'ajout au panier, et il fonctionne de la même façon sur tous les thèmes, y compris les anciens thèmes (vintage). Pour le placer ailleurs, consultez Choisir un emplacement précis.

• Il apparaît sur chaque page produit dont le produit fait partie d'une offre Publiée, quel que soit le modèle de produit utilisé.
• Vos options de lot se placent juste à côté des options d'abonnement. Le fait que les options de lot soient au-dessus ou en dessous se règle dans Design > Éléments > Mise en page > Lot en premier.
• L'espace au-dessus et en dessous du widget se règle dans Design > Espacement > Autour du widget.
• Le widget n'a pas de bouton d'ajout au panier propre. Il utilise le bouton d'ajout au panier de votre thème, votre page produit a donc besoin du bloc Boutons d'achat du thème.

Choisir un emplacement précis

Il y a deux façons de déplacer le widget : le réglage Emplacement de la page Design, qui s'applique à toutes les pages produit à la fois (un design enregistré a son propre Emplacement, pour les offres qui l'utilisent), ou le bloc Subscriptions + Bundles, que vous faites glisser exactement où vous le souhaitez.

Avec le réglage Emplacement :

1. Dans l'application, allez dans Design. La section Emplacement s'affiche une fois le widget activé (voir les étapes ci-dessus).
2. Choisissez un Emplacement sur la page produit :
3. • Au-dessus du bouton Ajouter au panier (automatique) : le réglage par défaut.
   • Sous les boutons d'achat : sous le bouton d'ajout au panier et les boutons de paiement express, comme Acheter maintenant.
   • Au-dessus du sélecteur de quantité : au-dessus du champ de quantité. Si votre thème affiche la quantité sur la même ligne que le bouton d'ajout au panier, le widget se place au-dessus de cette ligne.
   • Personnalisé (sélecteur CSS) : n'importe où sur la page. Saisissez dans Sélecteur CSS un sélecteur CSS correspondant à un élément de votre page produit, par exemple .product__title, et choisissez sous Placer le widget si le widget se place avant ou après cet élément, ou à l'intérieur, au début ou à la fin.
3. Cliquez sur Enregistrer.

Si l'emplacement choisi n'existe pas sur une page (par exemple une page produit sans sélecteur de quantité, ou un sélecteur qui ne correspond à rien), le widget revient à son emplacement automatique au-dessus du bouton d'ajout au panier, il ne disparaît donc jamais. Le réglage s'applique à tous les thèmes sur lesquels vous activez le widget.

Avec le bloc : si vous voulez le widget à un endroit précis, par exemple sous le prix ou sous une ligne d'avis, ajoutez le bloc Subscriptions + Bundles à cet endroit :

1. Allez dans Boutique en ligne > Thèmes et cliquez sur Personnaliser.
2. Ouvrez une page produit avec le sélecteur de modèle en haut de l'éditeur (par exemple Produits > Produit par défaut).
3. Dans la section des informations produit, cliquez sur Ajouter un bloc, puis Applications, puis Subscriptions + Bundles.
4. Faites glisser le bloc à l'endroit où vous voulez le widget et cliquez sur Enregistrer.

Laissez l'intégration d'application activée. Partout où un bloc Subscriptions + Bundles est présent sur la page, la copie de l'intégration se retire d'elle-même, vous n'obtenez donc jamais deux widgets de cette façon.

Afficher le widget sur d'autres pages

Vous pouvez aussi vendre depuis une page qui n'est pas la page du produit lui-même, comme une page d'atterrissage, une page de collection, votre page d'accueil ou un article de blog. Le widget complet y apparaît, avec les mêmes options de lot, les mêmes options d'abonnement et le même design que ceux que vous avez configurés sur la page Design.

1. Dans votre éditeur de thème, ouvrez la page souhaitée.
2. Ajoutez une section qui affiche un seul produit. La plupart des thèmes l'appellent Produit en vedette.
3. Dans cette section, cliquez sur Ajouter un bloc, puis Applications, puis Subscriptions + Bundles.
4. Cliquez sur le bloc et définissez son Produit. En dehors d'une page produit, le bloc ne peut pas deviner de quel produit il s'agit, il faut donc le lui indiquer. Tant que ce n'est pas fait, l'éditeur de thème affiche Nothing to show yet: this block has no product selected.
5. Gardez le bloc Boutons d'achat de la section. Le widget utilise ce bouton d'ajout au panier.
6. Cliquez sur Enregistrer.

L'intégration d'application seule n'affiche le widget que sur les pages produit. Pour toute autre page, utilisez le bloc comme ci-dessus.

Pour un bouton, une bannière ou un e-mail, une autre possibilité est un lien d'abonnement rapide : Croissance > Liens d'abonnement rapide crée un lien qui mène directement au paiement avec le produit et l'abonnement déjà choisis. Consultez Créer des invitations à s'abonner (liens d'abonnement rapide).

Fenêtres d'ajout rapide et d'aperçu rapide

De nombreux thèmes ont un bouton Ajout rapide ou Aperçu rapide sur les fiches produit des collections et de la page d'accueil. L'affichage du widget à cet endroit dépend du thème :

• Thèmes dont la fenêtre charge le formulaire produit complet (par exemple Dawn avec l'ajout rapide standard) : le widget et les options de lot s'affichent dans la fenêtre quand le bloc Subscriptions + Bundles est présent dans votre modèle de produit. Ajoutez-le comme décrit dans Choisir un emplacement précis.
• Horizon et les thèmes basés sur lui : pour un produit avec un abonnement, le bouton d'ajout rapide ouvre la page produit au lieu d'une fenêtre, et le widget s'y trouve comme d'habitude.
• Autres thèmes : si la fenêtre n'affiche pas de widget ou en affiche un cassé, désactivez l'ajout rapide dans l'éditeur de thème (c'est généralement un réglage de la section de collection ou de grille de produits) pour que les acheteurs aillent sur la page produit, ou contactez le support et nous vérifierons votre thème.

PageFly et autres constructeurs de pages

Il n'y a pas d'identifiant de widget, de shortcode ni de code d'intégration, et coller du code dans un élément Custom Code ou HTML ne fonctionnera pas. Le widget est un bloc d'application Shopify, et Shopify ne permet d'ajouter des blocs d'application que via l'éditeur de thème. Les constructeurs de pages le permettent avec leur propre élément de bloc d'application.

Sur une page produit PageFly, vous n'avez rien à faire. Avec l'intégration d'application activée (voir les étapes ci-dessus), le widget se place de lui-même au-dessus du bouton d'ajout au panier, comme sur une page produit du thème.

Sur une page d'atterrissage PageFly :

1. Dans l'éditeur PageFly, ouvrez votre page et faites glisser l'élément App blocks (sous Shopify elements) à l'endroit où vous voulez le widget. PageFly autorise un seul élément App blocks par page, et il nécessite un thème Online Store 2.0.
2. Suivez l'invite de PageFly pour ouvrir l'éditeur de thème, puis cliquez sur Ajouter un bloc, Applications, Subscriptions + Bundles.
3. Cliquez sur le bloc et définissez son Produit sur le produit ciblé par votre offre.
4. Assurez-vous que la page contient aussi le bouton d'ajout au panier PageFly pour ce même produit, puis enregistrez et publiez.

Le guide de PageFly pour cet élément : How to use the App blocks element.

GemPages, Shogun et les autres constructeurs fonctionnent de la même façon : les pages produit reçoivent le widget via l'intégration d'application, et les autres pages ont besoin de l'élément du constructeur pour les blocs d'application Shopify, avec Subscriptions + Bundles ajouté dedans. Si votre constructeur ne propose pas le bloc, contactez le support.

Configurer sur un thème non publié

Activer le widget ouvre toujours votre thème en ligne (publié). Pour configurer et tester d'abord sur un autre thème :

1. Allez dans Boutique en ligne > Thèmes, trouvez le thème et cliquez sur Personnaliser (ou Modifier le thème).
2. Ouvrez Intégrations d'applications, activez Supr Bundle & Subscriptions et cliquez sur Enregistrer.
3. Prévisualisez ce thème et ouvrez un produit qui fait partie de l'une de vos offres.

Le widget n'apparaît que sur les thèmes où il est activé, votre thème en ligne reste donc inchangé tant que vous ne l'y activez pas aussi. Vos offres sont partagées par tous les thèmes : une fois le widget activé sur votre thème en ligne, chaque offre Publiée s'y affiche.

Dépannage

Si vous ne voyez toujours pas le widget sur vos pages produit, suivez Le widget d'abonnement ne s'affiche pas dans ma boutique. S'il apparaît deux fois ou au mauvais endroit, consultez Le widget d'abonnement apparaît deux fois ou en bas de la page.

Questions fréquentes

Dois-je ajouter un code d'intégration ou un extrait Liquid à mon thème ?
Non. Design > Activer le widget active le widget dans votre thème, et vous cliquez sur Enregistrer dans l'éditeur de thème. Rien n'est à coller.

J'ai cliqué sur Activer le widget mais rien n'a changé sur ma boutique. Pourquoi ?
Presque toujours parce que l'éditeur de thème a été fermé sans cliquer sur Enregistrer. Cliquez à nouveau sur Activer le widget puis sur Enregistrer en haut à droite de l'éditeur de thème.

Ai-je besoin de l'intégration d'application et du bloc d'application ?
Vous avez besoin de l'intégration d'application. Le bloc Subscriptions + Bundles est facultatif : ajoutez-le uniquement pour choisir un emplacement précis ou pour afficher le widget sur une page qui n'est pas une page produit. Utiliser les deux n'affiche jamais le widget deux fois.

L'éditeur de thème indique que le bloc d'application n'a pas pu être ajouté. Que faire ?
Utilisez plutôt l'intégration d'application : Design > Activer le widget, puis Enregistrer. L'intégration n'a pas besoin d'une place dans votre section produit, elle fonctionne donc sur les thèmes dont la section produit n'accepte pas les blocs d'application.

Dois-je ajouter le widget à chaque produit ?
Non. Le widget s'affiche sur chaque produit qui fait partie d'une offre Publiée. Vous choisissez les produits dans l'offre, sous S'applique à, pas dans le thème.

Puis-je afficher le widget sur ma page d'accueil ou une page d'atterrissage ?
Oui. Ajoutez une section Produit en vedette, ajoutez-y le bloc Subscriptions + Bundles et définissez son Produit. Consultez Afficher le widget sur d'autres pages.

Les clients peuvent-ils choisir un abonnement sur la page du panier ?
Oui, avec le module Vente incitative du panier de la page Design : un bouton Abonnez-vous et économisez sous chaque produit acheté en achat unique, sur la page du panier et dans le tiroir du panier, fait passer ce produit sur sa première option d'abonnement. Pour choisir une autre fréquence, les clients font leur choix sur la page produit. Sur Shopify Plus, le Checkout Subscription Picker leur permet aussi de changer au moment du paiement, consultez Passer à un abonnement au paiement. Consultez Vente incitative du panier.

Puis-je plutôt placer le widget sous le bouton d'ajout au panier ?
Oui. Sur la page Design, réglez Emplacement > Emplacement sur la page produit sur Sous les boutons d'achat et cliquez sur Enregistrer. Consultez Choisir un emplacement précis.

Comment placer le widget au-dessus du bouton d'ajout au panier ?
Avec l'intégration d'application activée, c'est là qu'il se place de lui-même. S'il se trouve ailleurs, consultez Le widget d'abonnement apparaît deux fois ou en bas de la page.

Guides associés

• [Guide vidéo] Comment activer l'INTÉGRATION D'APPLICATION
• Le widget d'abonnement
• Le widget d'abonnement ne s'affiche pas dans ma boutique
• Le widget d'abonnement apparaît deux fois ou en bas de la page
• Créer des invitations à s'abonner (liens d'abonnement rapide)
• Qu'est devenu l'éditeur de widget

Mis à jour le : 24/10/2026