Configurer une section de bundle Build-a-box

La section Créer une boîte ajoute un configurateur de bundle à une page de thème Pops : les acheteurs choisissent des produits et des variantes, définissent les quantités, débloquent une remise par paliers et ajoutent le bundle final au panier. Configurez-la dans l’éditeur de thème Shopify en plaçant la section sur un modèle de page, en choisissant la collection de produits et en configurant les limites du bundle et les paliers de remise. Il s’agit d’une section de thème Pops, et non d’une offre Snap Bundle.

Avant de commencer

La section est placée sur un modèle de page et est donc hébergée sur une page Shopify. Le thème Pops fournit un modèle de page personnalisé dédié (page.build-your-box) qui contient déjà la section ; attribuez-le à la page qui héberge votre configurateur de bundle, puis ouvrez cette page dans l’éditeur de thème. La section n’est pas disponible dans les groupes d’en-tête ou de pied de page.

Ajouter la section à une page

Placez la section Créer une boîte sur le modèle de page avant de la configurer. Lorsque le sélecteur de sections de l’éditeur de thème est utilisé, le préréglage Créer une boîte apparaît sous Produit.

1. Dans l’interface administrateur Shopify, attribuez le modèle page.build-your-box à la page qui doit afficher le configurateur de bundle.

2. Dans l’éditeur de thème, ouvrez cette page et localisez la section Créer une boîte.

3. Si le modèle ne l’inclut pas déjà, ajoutez la section depuis le sélecteur de sections en choisissant Créer une boîte sous Produit.

Choisir la sélection de produits

Les produits proviennent d’une seule collection Shopify, et la section affiche uniquement les produits qui en font partie. Les produits s’affichent uniquement lorsqu’une collection est sélectionnée et qu’elle contient des produits ; en l’absence de collection ou si celle-ci est vide, la section affiche des cartes d’espace réservé.

1. Dans les paramètres de la section, définissez Collection sur la collection qui fournit les produits à partir desquels les clients créent leur boîte.

2. Définissez Produits à afficher sur le nombre de produits de la collection à afficher, de 1 à 24 (12 par défaut).

3. Définissez Type de sélecteur de variante sur Menu déroulant (par défaut) ou Boutons.

4. Laissez Afficher les nuanciers (si disponibles) activé pour afficher les nuanciers de couleur lorsque vos données produit les fournissent.

Définir les limites du bundle et les paliers de remise

Les limites du bundle plafonnent le nombre d’articles qu’un client peut ajouter, tandis que les paliers de remise récompensent les boîtes plus grandes. Le bouton de récapitulatif reste désactivé tant que le bundle n’a pas atteint le minimum, afin que les clients ne puissent pas envoyer une boîte trop petite.

1. Définissez Quantité minimale sur le nombre total minimal d’articles qu’un client peut ajouter, de 1 à 19 (1 par défaut).

2. Définissez Quantité maximale sur le nombre total maximal d’articles, de 1 à 20 (3 par défaut). Le contrôle de quantité de chaque produit est plafonné à cette valeur, et tout ajout qui la dépasserait est refusé avec le message Vous pouvez ajouter jusqu’à {maximum} article(s).

3. Configurez les quatre Paliers de remise, chacun composé d’une paire nombre d’articles et remise (%). Le nombre d’articles va de 1 à 20 et les remises de 0 % à 90 %.

4. Activez Afficher la barre de progression pour montrer aux clients à quelle distance ils se trouvent du palier suivant (activé par défaut).

Les paliers par défaut sont les suivants :

Au moment du paiement, la section ignore tout palier dont le nombre d’articles ou la remise est égal à zéro et trie les autres par nombre d’articles. Le palier actif est le palier le plus élevé dont le nombre d’articles est inférieur ou égal à la quantité totale du client, et la remise est appliquée au sous-total du bundle. Avant d’atteindre un palier, le client voit Ajoutez {remaining} article(s) pour obtenir {percent}% de remise ; une fois le palier atteint, il voit Remise sur le bundle appliquée : {percent}% de remise.

Appliquer les paliers de remise au moment du paiement

La tarification par paliers du configurateur de bundle est un aperçu calculé dans le thème ; lorsque la section ajoute le bundle au panier, elle n’envoie que les identifiants de variante et les quantités. Pour appliquer les mêmes paliers au moment du paiement, créez une remise automatique Shopify native pour chaque palier : une remise Montant de remise sur les produits avec une condition Quantité minimale d’articles définie sur le nombre d’articles du palier. Une boîte de 3 articles au palier de 30 % affiche sur la page (26,97 $ moins 8,09 $) et applique une remise équivalente dans le panier (environ 8 $ d’économie), à condition que les remises correspondent aux paliers de la section.

L’aperçu du thème et la remise au moment du paiement sont deux systèmes distincts qui ne se synchronisent pas. Configurez d’abord la collection de boîtes (voir Choisir la sélection de produits), puis ciblez cette même collection dans chacune des remises ci-dessous.

1. Dans l’interface administrateur Shopify, accédez à Remises et créez une remise en choisissant Montant de remise sur les produits et la méthode Automatique.

2. Définissez Valeur de la remise sur Pourcentage et saisissez le pourcentage du palier (5 pour 1 article, 15 pour 2, 30 pour 3 et 45 pour 5).

3. Définissez S’applique à sur Collections spécifiques et sélectionnez la collection de boîtes.

4. Sous Conditions minimales d’achat, choisissez Quantité minimale d’articles et saisissez le nombre d’articles du palier.

5. Sous Combinaisons, désélectionnez Remises sur les produits afin que les paliers ne se cumulent pas.

6. Définissez les Dates d’activation pour commencer maintenant, sans date de fin, puis enregistrez et vérifiez que la remise est Active.

7. Répétez l’opération pour les trois autres paliers.

Lorsque plusieurs remises peuvent s’appliquer, Shopify applique celle qui offre le meilleur avantage pour le panier du client. Ainsi, une boîte qui n’atteint pas un palier supérieur bénéficie du palier immédiatement inférieur plutôt que de cumuler les remises. Testez chaque palier lors d’un paiement réel pour vérifier que l’aperçu de la boîte et la remise du panier correspondent.

Configurer le texte d’introduction

Un texte d’introduction au-dessus des cartes produit s’affiche uniquement lorsque vous ajoutez des blocs de contenu à la section. Le préréglage par défaut ajoute un bloc de titre et un bloc de texte principal, et le modèle fourni utilise Créez votre bundle parfait comme titre et Choisissez vos favoris et débloquez des remises exclusives. comme texte principal.

1. Dans la section, ouvrez le bloc Texte utilisé comme titre et définissez le texte souhaité.

2. Ouvrez le bloc Texte utilisé comme texte principal et définissez le contenu complémentaire.

3. Ajoutez ou supprimez des blocs Texte selon vos besoins ; le Type de chaque bloc est défini sur Titre ou Corps.

Tester l’expérience client

Prévisualisez la page et parcourez l’ensemble du processus avant de la publier afin de vérifier que les choix de produits, les remises et le comportement du panier fonctionnent comme prévu.

1. Dans l’éditeur de thème, ouvrez l’aperçu de la page et choisissez un produit, une variante et une quantité, puis utilisez Ajouter au bundle.

2. Vérifiez qu’un produit dont la variante sélectionnée est en rupture de stock ou indisponible ne peut pas être ajouté : son bouton Ajouter au bundle est désactivé.

3. Vérifiez que le Récapitulatif du bundle répertorie chaque article avec son prix et sa quantité, et que le Sous-total, la Remise sur le bundle et le Total se mettent à jour lorsque vous ajoutez des articles.

4. Vérifiez que Ajouter le bundle au panier reste désactivé jusqu’à ce que la quantité totale atteigne le minimum et que le total ne soit jamais inférieur à zéro.

5. Cliquez sur Ajouter le bundle au panier et vérifiez que tous les articles sélectionnés sont ajoutés au panier en une seule fois.

Consultez la référence Créer une boîte pour accéder au tableau complet des paramètres et à la liste complète des libellés visibles par les clients.