The Dynamic Bundle Widget shows a set of recommended products on your Product Detail Page (PDP) and lets a customer add all of them to the cart in one click. Use this article to create the widget, choose whether the bundle appears inline or in a popup, control which products it recommends, add and protect a bundle discount, and test the widget before shoppers see it.
The Dynamic Bundle Widget does not create a fixed Shopify bundle product. It shows recommended products with a checkbox beside each one, so a customer can uncheck what they do not want and add the rest to the cart in a single add event. That makes it a good fit for frequently bought together offers, complete the look sets, and accessory pairings.
Note: The Dynamic Bundle Widget and Bundle Builder are separate Rebuy products. If you want a guided, multi-step build your own bundle experience on a dedicated page, read Choosing Between Bundle Builder and Dynamic Bundle Widget before you build the widget below.
Create a Dynamic Bundle Widget
You create a Dynamic Bundle Widget from the Product Page presets in your Rebuy Widgets dashboard.
In the Rebuy admin, open your Widgets dashboard. Depending on your Rebuy plan version, the left sidebar shows this as either Cart & Merchandising > Widgets or Merchandising Widgets.
Select Product Page.
If you have not created any product page widgets yet, find the Dynamic Bundle card and select Create New. If you already have product page widgets, select New Widget in the top right to open the list of pre-configured options, then choose Dynamic Bundle.
Name the widget and save it. Rebuy opens the widget editor, and the widget stays hidden from shoppers until you turn on Live Mode.
Choose the Display Type: Embed or Popup
Display Type is the setting in the widget's General settings that controls how the Dynamic Bundle appears on your page. Embed is the default and shows the Dynamic Bundle inline on the page, which is the widget's original behavior. Popup shows the Dynamic Bundle in an overlay that opens only when a customer clicks an onsite trigger button, which keeps the page compact until a customer chooses to build a bundle.
The following table compares the Display Type values, how the Dynamic Bundle appears for each one, and the kind of product page each one suits.
Display Type | How the Dynamic Bundle appears | Best for |
Embed (default) | Inline on the page, taking up on-page space by design. | Product pages where you want the bundle visible immediately, with no click required. |
Popup | In an overlay that opens when a customer clicks an onsite trigger button. | Product pages where you want to keep the layout compact and surface the bundle on demand. |
Either Display Type gives the customer the same personalized, one-click bundle-building experience. What changes is whether the bundle is always visible on the page, which is Embed, or opens on demand from a trigger button, which is Popup.
Choose a Popup layout: List, Stacked, or Horizontal
When you create a new Dynamic Bundle Widget you can set the Widget's Display Type to Popup, Rebuy walks you through a guided Setup Wizard. For Popup Layouts, use the Select Layout step to control how the bundle products are arranged inside the popup. The available layouts are:
List: arranges the bundle products in a row at the top of the popup, connected with a "+" between each product, with the configurable settings and fields listed below the row.
Stacked: arranges each bundle product and its settings as a full-width row, stacked vertically down the popup.
Horizontal: arranges the bundle products side by side, each with its own settings and variant dropdown beneath it.
Every Popup layout shows the same bundle information, so pick the one that best matches your page design and the number of products in your bundle. You can change the layout later from the widget's editor in the Layout tab without rebuilding the widget.
What customers see in the Dynamic Bundle Popup
When the Dynamic Bundle Widget uses the Popup Display Type, the customer opens and completes the bundle inside the overlay:
The customer clicks the onsite trigger button on your product page, which opens the Dynamic Bundle Popup.
Each bundle product appears with its image, name, price, and a variant selector such as Select Size, the same as it does in the Embed display.
The customer selects a variant for each product in the bundle and unchecks any product they do not want.
The customer selects Add Bundle to Cart, which adds every selected item to the cart in one action.
Control which products the Dynamic Bundle recommends
The products a Dynamic Bundle Widget shows come from its Data Source, and new widgets are powered by Rebuy's AI Recommended endpoint out of the box.
A new Dynamic Bundle Widget's default layout is configured for 3 product recommendations in addition to the shell product. The shell product is the product on the page a customer has landed on, so the widget preview pane shows only the recommendations, because the preview has no product page to read a shell product from.
To pair specific products with specific recommendations, build IF statements in the widget's Data Source. For example, pair a trigger product with a fixed set of recommendations, then add a catch-all with the condition IF Products Equals Anything so AI-recommended products still show when no other condition matches. For the full setup, read How to configure Product Page and Cart-based rules and Data Sources 101.
When Display Variants as Products is turned on, each variant counts as an individual product against the widget's display limit. The shell product is excluded from that count.
Place the Dynamic Bundle Widget on your product page
Placement controls where the Dynamic Bundle Widget renders on the PDP, and you set it in the widget's configuration menu.
Place the Dynamic Bundle Widget high on the PDP, below the Add to Cart button, the product image, or the product description. For exact positioning, use the widget's built-in Dynamic Placement Selectors to target the element you want the widget to render next to.
Add a bundle discount with Shopify Functions
Rebuy's integration with Shopify Functions lets you generate and apply a bundle discount from the Dynamic Bundle Widget's settings page, with no discount code and no Shopify Admin setup.
Shopify Functions discounting is available on all Shopify plan types. For how Rebuy discounting works end to end, read Rebuy Discounting Overview.
Turn the widget's discount off when your promotion ends.
Uninstalling the widget or turning off Live Mode does not remove the discount from items that are already in a customer's cart.
Warning: When you run other Shopify discounts at the same time as a Rebuy Shopify Functions discount, set those other discounts to be combinable so they do not override the Rebuy discount. Rebuy's own discounts are set to combine automatically, but Rebuy cannot change the settings of discounts you create in Shopify Admin.
To make a Shopify discount combinable, open that discount in your Shopify Admin, go to its Combinations settings, and turn on the combination options you need. Shopify documents this at Discount combinations.
Combinable settings alone do not put two product discounts on the same product. If your store is on Shopify Plus and you want a store sale and a Rebuy bundle discount to both apply to the same bundled product, turn on Enable discount stacking under Settings > Discount Combinations in the Rebuy admin, then tag that Shopify discount rebuy and set its Product discounts combination to Multiple per product allowing rebuy. See Discount Combinations: Stack a Rebuy Discount and a Shopify Discount on the Same Product. On every other Shopify plan, Shopify applies one product discount per product and keeps the larger one.
Rebuy's Shopify Functions integration does not apply conditional discounts built with Data Sources. A conditional discount configured that way is visual only, unless you run it through a Shopify discount or the Script Editor instead.
Protect the bundle discount when a customer removes items
The Discount Protection panel in the Dynamic Bundle Widget's Discount settings controls what happens when a customer removes an item from a bundle. The panel appears only after you set a Discount Type other than None and turn on Discounted By Functions, so a bundle you discount with a Shopify automatic discount you built yourself in Shopify Admin has no protection settings to configure.
The panel holds two protections, Enable Discount Protection and Enable Bundle Protection, and they cannot both be on. Turning on Enable Bundle Protection turns Enable Discount Protection off, and turning on Enable Discount Protection turns Enable Bundle Protection off. Both are off on a new widget, so by default a customer can remove bundle items and keep the discount on whatever is left.
The following table compares the two protections by what each one requires, what it does once the customer stops meeting that requirement, and what happens to the bundle items already in the cart.
Setting | What it requires | What happens when the requirement is not met | What happens to the bundle items |
Enable Discount Protection | At least the number of bundle items set in Minimum Items to get Discount. | The bundle discount stops applying to the bundle items still in the cart. | Enable Discount Protection leaves every item in the cart and charges full price for it. |
Enable Bundle Protection | That the customer leaves out no more items than Maximum Items Allowed to Remove permits. | Rebuy removes the rest of that bundle's items from the cart. | Enable Bundle Protection clears the remaining bundle items out of the cart. |
Keep the bundle discount above a minimum item count
Enable Discount Protection requires a minimum number of bundle items in the cart before the bundle discount applies, and it never removes anything from the cart. Turn it on when you would rather a customer keep what they chose and lose the discount than have items taken out of their cart for them.
Minimum Items to get Discount is that minimum, and a new widget arrives with it set to 2. Rebuy re-checks the count whenever the cart changes:
The cart holds at least the minimum number of bundle items, so the bundle discount applies.
The cart holds fewer than the minimum, so the discount stops applying to the bundle items still in the cart and the customer pays full price for them.
Minimum Items to get Discount is set to 0, so there is no minimum and the bundle discount always applies.
The count includes the product the customer was viewing when they added the bundle, because that product is part of the bundle. It counts bundle items rather than units, so a customer who raises the quantity on one bundle item has still contributed a single item toward the minimum.
Remove the rest of the bundle when too many items come out
Enable Bundle Protection allows a set number of removals and clears the rest of the bundle out of the cart once a customer goes past that number. Turn it on when a partial bundle sold at a bundle price is worse for you than no bundle at all.
Maximum Items Allowed to Remove sets how many items a customer can remove from the bundle and still qualify for the discount:
0: the customer must keep every item in the bundle to get the discount.
1: the customer can remove one item and still get the discount.
2 or more: the customer can remove that many items and still get the discount.
Rebuy works out the requirement from the full bundle at the moment the customer adds it, counting the product they were viewing, then tags each bundle item so it can recount on every cart change.
If a customer removes more items than Maximum Items Allowed to Remove permits, Rebuy removes the rest of that bundle's items from the cart automatically. The customer keeps anything they added outside the bundle. This also happens when a customer unchecks too many products before adding the bundle, so the bundle items can disappear moments after the customer adds them, unless you also turn on Disable Add to Cart when Incomplete.
Block Add to Cart until the bundle is complete
Disable Add to Cart when Incomplete appears once Enable Bundle Protection is on, and it keeps the widget's Add to Cart button unavailable while a customer has more items unchecked than Maximum Items Allowed to Remove permits. Use it when a bundle only makes sense complete, such as a curated set, or when specific items have to be present for the discount to be valid.
With Disable Add to Cart when Incomplete on and Maximum Items Allowed to Remove set to 0, the widget hides the product checkboxes, so a customer takes the whole bundle or none of it.
Test the Dynamic Bundle Widget, then turn on Live Mode
Live Mode is the toggle that decides whether shoppers see the widget. Leave it off while you install and test, and turn it on when the widget is ready.
Leave Live Mode off in the widget settings. While it is off, the widget is in preview mode and does not render for your shoppers.
Install the widget on your product page template and open a product page.
Use Widget Preview Mode to confirm the products shown match the Data Source configuration you built.
Turn Live Mode on. If the widget is installed on your site, it is now visible to your customers.
If the widget does not appear after you turn on Live Mode, confirm it is installed on the template you are viewing, then confirm the Data Source returns products for that shell product.
Change the Dynamic Bundle Widget's text in the Language settings
Every piece of text the Dynamic Bundle Widget shows a customer comes from the widget's Language settings, so change the wording there rather than in your theme. In the widget editor, select Language in the sidebar, where General holds the text around the bundle and Call to Action holds the button text.
The following table lists each field in the order it appears, General first and then Call to Action, with what it changes on your storefront and the text it arrives with.
Field | What it changes | Default text |
Super Title | The small heading above the main title. | Recommended |
Title | The widget's main heading. | Frequently Bought Together |
Description | The paragraph below the title. | Empty |
Launch Button Label | The product page button that opens the bundle when Display Type is Popup. | Build your bundle and save {{discount_amount}} |
Single Variant Option | The prompt on a bundle product with one option, such as size. | {{option_name}} |
Multiple Variant Options | The prompt on a bundle product with more than one option. | Options |
Sold Out Label | The label on an out of stock bundle product. | Sold Out |
Saving Amount Text | The savings figure beside the bundle price. | Save {{saving_amount}} |
Total Price Label | The label beside the bundle's combined price. | Total Price: |
Add to Cart | The bundle's add to cart button. | Add to Cart |
Adding to Cart | That button while Rebuy adds the bundle. | Adding... |
Added to Cart | That button once the bundle is in the cart. | Added! |
Decline Offer | The button that dismisses the bundle without adding it. | No Thanks |
Continue | The button that closes the popup. | Continue |
A few behaviors are worth knowing before you edit these fields:
Super Title, Title, and Description are hidden when empty, so clearing one removes it instead of rendering a blank line.
Text in double curly braces is a merge tag that Rebuy swaps for a real value, so {{option_name}} becomes that product's option name, {{saving_amount}} becomes the amount saved, and {{discount_amount}} becomes the bundle discount. Delete a tag and the field shows only the plain text left around it.
Decline Offer and Continue appear only while Display Type is Popup, and the text you saved in them is kept if you switch back to Embed.
Style the Dynamic Bundle Widget with custom CSS
Anything the widget editor cannot style, you can style with custom CSS added in the widget's editor Display tab, scoped to that widget's ID.
For copy-and-paste snippets covering bundle background colors, product titles and prices, checkboxes, images, and widget width, read Customize the Dynamic Bundle Widget.
See styled Dynamic Bundle Widgets on the Rebuy demo store
Rebuy's demo store has a page of live Dynamic Bundle Widgets you can open, click through, and inspect: Dynamic Bundle Widget examples on the Rebuy demo store. Every example on that page uses the Embed Display Type styled with custom CSS, so the bundle names used there are CSS treatments of the inline widget, including the one called Stacked Bundle, which is not the same thing as the Stacked layout you choose for the Popup Display Type.
Frequently Asked Questions
Why does the Dynamic Bundle Widget preview show fewer products than I configured?
The Dynamic Bundle Widget preview shows fewer products than you configured because the preview pane cannot see the shell product. The shell product is whichever product the customer has landed on, and the preview pane is not rendering on a product page, so it has no shell product to pull in. A new Dynamic Bundle Widget's default layout is configured for 3 product recommendations plus the shell product, so the preview shows the 3 recommendations only. On a live product page the shell product appears alongside them.
Can a Dynamic Bundle Widget include both one-time purchase and subscription products?
No, a Dynamic Bundle Widget cannot include both one-time purchase and subscription products in the same bundle. It is one or the other, because the widget adds every bundle item to the cart in a single add event, and Shopify does not allow one-time purchase and subscription items to be mixed within a single add event. To offer both, set each Dynamic Bundle Widget to a single purchase type and build a separate widget for the other, then use Data Source conditions to control which one shows on which product page.
Related articles
Customize the Dynamic Bundle Widget for custom CSS snippets.
Choosing Between Bundle Builder and Dynamic Bundle Widget to confirm which bundle product fits your store.
Creating a Full-Page Dynamic Bundle Takeover to merchandise a curated bundle on its own page.
How to Create a Product Upsell Widget if you have pre-configured bundles you want to upsell instead.