Last updated: May 2026 Category: Bundles
Overview
The Bundle Builder lets you offer "Build Your Own Bundle" experiences in your mobile app. Customers pick a set of products from a curated list, and the more items they add, the bigger the discount they unlock. Bundles are a proven way to lift average order value and clear slow-moving inventory.
When a customer completes a bundle, BeyondCart generates a one-time Shopify discount code on the fly and applies it to their cart. Checkout happens through your normal Shopify storefront — no separate payment flow.
What You Can Do
Configure discount tiers (e.g., 3 items = 10% off, 5 items = 15% off, 7 items = 20% off).
Choose which products are included and mark some as optional add-ons.
Pick from two mobile layouts: a guided multi-step wizard or a single-page grid.
Customize colors, banners, and a custom CSS layer to match your brand.
Set a checkout mode: send the customer straight to checkout, or add the bundle to their cart so they can keep shopping.
Where to Find It
In the admin dashboard, go to Engagement → Bundles. You will see a list of all bundles for your site, plus a button to create a new one.
[Screenshot: Bundles list page in the admin]
Creating a Bundle
Click Create Bundle.
Set the basics:
Title — Optional. Leave empty if your banner already serves as the title.
Description — Short explainer shown above the products.
Active — Off by default. Toggle on when you are ready to publish.
Choose a Layout:
Stepped — A multi-step wizard with a progress bar. Best for guided experiences with optional add-ons.
Grid — A single scrollable page with a tier picker at the top. Best for fast bundle building.
Pick a Checkout Mode:
Direct — Send the customer straight to Shopify checkout when they finish the bundle.
Add to Cart — Add the bundle items to their cart so they can keep browsing before checking out.
Click Save.
[Screenshot: New bundle form with title, layout, and checkout mode]
Adding Discount Tiers
Tiers define the deal. Each tier has a minimum item count and a discount percentage.
In the bundle editor, open the Tiers section.
Click Add Tier.
For each tier set:
Minimum Items — How many items the customer must add to unlock this tier.
Discount % — The percentage off applied at checkout.
Label — Optional display text (e.g., "Best Value", "Most Popular").
Add as many tiers as you need. The app sorts them automatically — the highest-discount tier is highlighted.
Example:
Min Items | Discount | Label |
3 | 10% | Starter |
5 | 15% | Most Popular |
7 | 20% | Best Value |
Selecting Products
Open the Products section in the bundle editor.
Click Add Products to search your Shopify catalog.
Select the products you want included in the bundle. Each variant the product has will be available in the app.
For the Stepped layout, you can mark any product as Optional. Optional products appear in a separate "Add-ons" step that customers can skip.
Tip: Draft and out-of-stock products are filtered out automatically in the mobile app, so you do not need to manage that yourself.
Stepped Layout: Steps & Display
If you chose the Stepped layout, you have extra controls under Steps & Display:
Show Tier Selector — Display the discount tier pills at the top of step 1.
Show Step Indicator — Display the numbered progress circles between steps.
Show Step Navigation — Display the Back / Skip header bar.
Step Names & Descriptions — Customize the heading and subheading for each step (Main, Optional, Summary).
Step Indicator Colors — Set the active, completed, and inactive colors for the progress circles and connector line.
These settings only apply to the Stepped layout. The grid layout is a single page and does not have steps.
Styling
The Styling section controls the look of your bundle in the app:
Primary Color — Tier pills, step indicator, add-to-bundle buttons.
Accent Color — Discount labels and "you're saving" text.
Background Color — The screen background behind the bundle.
Progress Bar Color — The fill color of the progress bar.
Button Color — The CTA button in grid layout (the "Add Bundle" / "Check out" button).
If you skip a color, the bundle uses your app theme defaults.
Banners
Add eye-catching banners at three positions:
Top — Above the products grid.
Before Optional — Between the main step and the optional add-ons step (Stepped only).
Before Summary — Above the summary screen (Stepped only).
For each banner you can set an image, title, subtitle, and an optional link.
Custom CSS
For advanced visual tweaks, paste CSS into the Custom CSS field. This is scoped to the bundle screen and will not affect the rest of your app.
How Discounts Apply at Checkout
When a customer finishes a bundle:
The app asks BeyondCart for a unique discount code.
BeyondCart creates a one-time Shopify discount via the Shopify Admin API. Each code is good for 24 hours and can only be used once.
The app builds a Shopify cart with all the bundle items and applies the discount code automatically.
The customer is sent to Shopify's checkout page.
Important: If your store has automatic discounts active (for example, "End of Winter Sale 20% off" applied site-wide), Shopify limits stacking discount codes with automatic discounts. In that case the customer will receive the larger of the two — your automatic store discount or the bundle code — but not both.
Mobile Customer Experience
Stepped Layout
Step 1 — Pick Your Products: Customers see your banner, the discount tier pills, a numbered step indicator, and a 2-column product grid. A bottom drawer keeps a running list of items, the progress bar, and a Next button.
Step 2 — Add-ons (Skippable): Optional products only. Customers can skip with one tap.
Step 3 — Summary: Full list of selected items with quantity controls, a price breakdown, and the Check out button.
The customer cannot advance past step 1 without meeting the lowest tier minimum. If they later remove items below the minimum, the app blocks the action with a clear explanation. This prevents customers from getting the bundle discount without actually qualifying.
Grid Layout
A single scrollable page with:
Tier picker at the top — customers select a target tier (e.g., 6 items for 20% off). The largest tier is selected by default.
Product grid — 2 columns with a variant dropdown and an Add button on each card. Buttons disable once the tier limit is reached.
Floating bottom panel — collapsible preview with item list, ± quantity controls, subtotal, and a "You're saving $X" badge once the tier is unlocked. The CTA button stays disabled until the tier is met and shows "Add X more to unlock" while incomplete.
Deep Linking to Your Bundle
You can drive customers straight to the bundle screen from a push notification, banner, or any other action by using the deep link:
beyondcart://bundle-builder
Use this anywhere BeyondCart accepts a custom deep link (campaigns, flow push notifications, template builder banner actions, etc.).
Tips and Best Practices
Start with three tiers. Two feels stingy, four overwhelms. The middle tier should be your "Most Popular".
Cap optional products at 5–8. Too many add-ons increases drop-off.
Use banners to set expectations — a top banner that says "Pick any 5 items, save 15%" outperforms a bare grid.
Test on a real device. What looks balanced in the admin preview can feel cramped on a small phone screen.
Watch your inventory. A bundle that funnels customers to a sold-out product will frustrate them. Keep the included list curated and refreshed.
FAQ
Q: Can a customer use a bundle discount code on Shopify's website too? A: No. Bundle codes are created on demand for the customer who built the bundle and expire after 24 hours. They are tied to the cart that BeyondCart builds in the app.
Q: What happens if a product goes out of stock between the customer adding it and checking out? A: Shopify will surface the inventory error at checkout. The customer can adjust quantities and try again. The discount code remains valid until the 24-hour expiry.
Q: Can I run multiple bundles at the same time? A: Yes. Each bundle has its own products, tiers, and styling. You can deep-link to any bundle independently.
Q: Does a bundle stack with other discount codes? A: Bundle codes are configured to combine with order, product, and shipping discounts. Whether they actually stack depends on your store's discount settings in Shopify.
Related Articles