Javascript Helpers


Advanced knowledge of Liquid is essential You need to have a strong understanding of Liquid to create your own bundle template implementation - Template Creator was built to allow you to create your own Bundle Page template from scratch.

Due to the complexity and personalised nature of this process, we are currently unable to offer support for this functionality.

Javascript Helpers

Javascript helpers are globally available functions to provide additional functionality to your custom templates.

window.BundleBuilder.canAddVariant(variantId, sectionIndex)

Returns true if a variant with given variantId from section (with index sectionIndex) can be added to the bundle, false otherwise. This depends on bundle limits and available variant quantity.

window.BundleBuilder.showMoreModal(variantId, sectionIndex, canSelectVariant, canAdd)

Includes a Read More modal dialog that shows all product images together with product description.

The variantId is an identifier of a variant that will be displayed. The sectionIndex is index of a section to which the variant belongs. canSelectVariant is optional and if set to false, it will hide variant selection dropdowns. canAdd is optional and if set to false, it will hide the button for adding variants to the bundle.

Add to Cart Changes

Bundle Builder by default will automatically redirect the customer to the Cart page once they are satisfied with the bundle

This usually works via a button that by default is labelled "Add bundle to cart".

It's possible to override this functionality, but it is not recommended to do so, as it might confuse the customer and affect their customer experience - additionally any further changes to the bundle won't be applied to the bundle already added to cart.

We'd also suggest not to open the Cart Drawer as after closing it, the customer would still see the bundle, but changing it won't have any effect.

If you really want to override this feature despite the above mentioned issues, you can define a global javascript function called bbAfterAddToCart - if defined it'll be called instead of redirecting to the cart page.


<script type="text/javascript"> window.bbAfterAddToCart = function () { // Do something instead of redirecting to cart } <script>