Kaching Bundles
Last updated: April 22, 2025
Kaching Bundle Quantity Breaks, sometimes referred to as Kaching Bundles, is a Shopify app which allows you to update your product buying experiences with upsells and bundled products.
Adding Kaching Bundles to a Replo page
First, make sure you have Kaching Bundles installed on your Shopify Store, have at least one bundle deal configured, and have enabled Kaching Bundles app embed in your Shopify Theme. You will also need a Replo Product Component in your Replo Element.
On the left side of the editor, click the "Components" toggle. Then, search for "Kaching Bundles Widget". Drag the Kaching component inside of the Product Component.
OR you can also use our Custom Liquid Component. Drag the Liquid component into your Product Component. Click on the 'config' tab and click 'Launch Code Editor', then paste in the following code and hit 'save':
<kaching-bundle product-id="{{ product.id }}"></kaching-bundle>
After saving, go ahead and publish the page to make sure it works. You will not be able to see the bundle widget in the editor, but it should appear on the live page just as they have been configured inside of the Kaching Bundles app.
Troubleshooting
Styling
The Kaching Bundles widget can be styled using the Kaching Bundles app.
Variant and Option Selectors
It is not recommended to include quantity or variant selectors inside of your product container component if you are using the Kaching Bundles widget. If a Kaching Bundles widget exists inside of the product container, its selected options will override any Replo quantity or variant selectors for that product container's add-to-cart button.
Multiple Add To Cart Interactions
The Kaching Bundles widget takes precedence over all Add Add To Cart Interactions, so doing things like having multiple Add To Cart interactions to add different products to the cart won't work. If you need to add a product to the cart manually after adding the Kaching products to the cart, you can use the Run Javascript interaction with code similar to this:
fetch("/cart/add.js", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
items: [
{ id: YOUR_VARIANT_ID_HERE, quantity: 1}
]
}),
})Make sure to replace YOUR_VARIANT_ID_HERE with the id of the product variant you want to add.ariant you want to add.
Dynamic Checkout Buttons
If you are using the Dynamic Checkout Buttons component, please note that these buttons will be hidden whenever a customer selects more than one variant. If the customer using the Kaching Bundles widget selects only a single variant, then the Dynamic Checkout Buttons will remain visible.
Multiple Kaching Embeds
If you put multiple Kaching embed components inside the same 📄 Shopify Product Components box, then Replo will use the first component to determine the quantity to add. This can cause issues if, for example, you create two different layouts (one for desktop and one for mobile) and they both include the Kaching embed component. To get around this, you can either:
Use 📄 Responsive Design to build only one container with a Kaching embed, but style it differently for desktop/mobile
Put the two separate Kaching components inside two different 📄 Shopify Product Components boxes
Wrong Quantity or Variant Being Added to Cart
Ensure you have only one Kaching embed in the 📄 Shopify Product Components box you're editing.
Kaching Embed not appearing
It is normal for the Kaching Bundles widget to not appear inside of the Replo Editor, but if it does not appear on the published page be sure to check the following:
Kaching Bundles is installed on your Shopify Store
The Kaching Widget or Liquid Component is inside of a Product Component
If you're using a Liquid Component, make sure it has the exact code block that was included above in step 4.
Kaching Bundles has been configured with at least 1 bundle deal that is compatible with the selected product in the Product Component.
If all else fails, reach out to the Replo Support Team. See Getting Help.