Product Bundling is an excellent merchandising strategy that helps merchants to increase average order value, decrease marketing and distribution costs, and reduce inventory waste.
With the new "Mix-and-Match Bundle" block, you will be able to choose up to 3 products for the block as well as set tiered discounts depending on how many products the customer adds from the bundle.
The buyer composes the bundle, by choosing a mix-and-match from the available products and associated variants!
The Mix-and-Match Bundle block can be found in the "Buy Boxes" section of the page block library:
Adding a Mix-and-Match Bundle
After you add the Mix-and-Match Bundle block to your page, you will be prompted to add products that you want included in your new bundle. Click the "Add Product" button to get started:
Next, choose up to 3 products from the Select Product popup by clicking the radio switch next to each product you want included. Click the "Save" button:
The "Products" tab
Back on the "Products" tab of the block settings, your selected products will show. You can perform the following:
Use "Bulk Edit" mode to set the Discount or Delete products from the block (1)
Set the Discount for a particular product (2)
📝Only the "None" and "Compare at price" discount options can be set for the products featured in the block. Tier-based discounting can be applied using the "Discounts" section below.
Choose which Product Variant(s) to use for a specific product (3)
Set tier-based Discounts for the bundle, depending on how many products the customer adds.
📝The discount amount you set will be applied to all products in the bundle dynamically based on how many product(s) from the bundle the buyer adds I.e. 0% if 1 product is added, 10% if 2 products are added and 20% if 3 products are added.
Click on the "More actions" button for each product to:
Drag and drop the products into different positions if needed:
The "Product View" tab
In the "Product View" tab, you can choose which elements to include in all product card columns featured in the bundle. An interactive preview (1) is provided that updates dynamically based on the element options (2) you select/unselect. You can also set the "Add To Bundle" checkbox color (3):
The "Layout" tab
In the "Layout" tab, you can choose which elements to include for the entire Buy Box area of the Mix-and-Match Bundle block. An interactive preview for both Desktop and Mobile views is provided that updates dynamically based on the element options you select/unselect.
Once you're done configuring the Layout settings to your liking, click the "Save" button to save your settings and exit to the Builder to make additional edits if needed.
Working with Mix-and-Match Bundle block Elements in the Builder
All elements that you've included for the Mix-and-Match Bundle block from the "Layout" tab and for the product cards in the block from the "Product View" tab are editable within the builder. Element examples include: Text fields, images, buttons, variants, pricing, etc.
To edit any element, simply hover over it and click on it to open the editing options:
Element settings can be adjusted in the left sidebar of the builder:
In the live example below, the buyer is able to:
Pick and choose a specific variant from each product included in the bundle
Check/uncheck the "Add To Bundle" checkbox for each product
See how their selections influence the bundle price based on the tiered discounts configured for the bundle
Click the "Add To Cart" button once they've made their selection(s)