The Dynamic Bundle Offer section is a fantastic choice to use if you're selling pre-built "bundle" products or multi-pack offers. In this section, you can add up to 3 different products the customer can choose from, and also features radio switches for quick product selection.
In the example below, the Dynamic Bundle Offer section is being used to offer either a single unit of the Boomstick Color product or a unit of the Boomstick Trio product instead, which includes all 3 Boomstick products.
📝Shopify doesn't currently support product bundling natively, where two or more different product SKUs can be combined into a bundle. In the example above, the Boomstick Trio product is actually just one unique Shopify product but presented and sold as a bundle.
Adding a Dynamic Bundle Offer
To add a Dynamic Bundle Offer to your page, follow the quick and easy steps below:
1. Find and select the Dynamic Bundle Offer section from the "Buy Boxes" section of the page section library:
2. Start adding your product(s) to the section using the "Add Product" button where you'll select each product individually, one at a time:
3. Once a product is selected, decide on the Variants you want to be used, any Discount you'd like shown or applied and the pre-set Quantity you want offered:
4. Repeat steps 2 and 3 to add your remaining product(s) you want to be featured (up to 3 products):
Creating a Multi-pack offer with a Discount
One way to create a multi-pack offer from a single product is to pre-set the Quantity and the Discount you want to be applied per unit.
In the example below, the Boom Calm product is being used for each column in the section but has Quantity set at 1, 2, and 3 units respectively. The Discount is offered for each unit is also $5, $7.50, and $10 respectively, indicating to the buyer that the more units that are bought, the better the discount and deal they will receive:
📝The product titles for each has been updated to include the number of units for each offer (1) the "Savings per unit" text has been added to offers 2 and 3 (2) and the "Best Value" label has been placed over the 3-pack offer indicating it's the overall best deal (3).
Please note that in order for the "Dynamic" discount code type to be auto-applied correctly, the button destination must be set to "Checkout":
The "Layout" tab
In the "Layout" tab, you can control which elements you want to be used for the Dynamic Bundle Offer section and which elements you want to be used for the offer(s) included in the section.
To access the Product Settings for the Dynamic Bundle Offer section, click on the ⚙️icon located in the top-right of the section when hovered over:
In the Product Settings popup, click into the "Layout" tab:
In the Layout > Buy Box section you pick and choose exactly which elements you want included for your Dynamic Bundle Offer section:
Image Area - 2 options available:
- Image Carousel - Shows the featured image section + a carousel with 15 image slots and 1 video slot.
- Product / Variant Image - Show only the featured image section. The featured image will update on the published page when one of the bundle options is selected.
Product Name - Display the product name field.
Product Callout - Add an additional text field to highlight the product. "BESTSELLER" is the default text.
Divider - Adds a divider below the Product Name field.
Star Rating - Adds a star rating element. The star ratings can be adjusted and can be clicked to direct to a specific section of the page containing your reviews.
Product Description - Adds a product description section below the star ratings.
Price Callout - Adds an additional line of text next to the product price. The default text is "& Free Delivery in the USA".
Retail Price - Show or hide the product's retail price from showing.
Product Discount - Adjusts the product price section to include a product discount display.
Quantity Selector - Show or hide a quantity selector for the entire Buy Box. Recommended to disable if using preset quantity for offers.
Product Disclaimer: Adds a line of text directly below the CTA button. The default text is "100% Money Back Guarantee"
Countdown Timer - Adds a countdown timer below the CTA button. The countdown timer text and time can be adjusted as needed
Unique Selling Propositions - Adds a small image element below the CTA button where you can display credit card logos or trust seals
Display Field Titles - Adds label text for the price and variant fields such as "Your Price:", "Variants:", etc
Size Chart - Add a size chart link/button that opens a lightbox popup containing a custom added image when clicked
FAQ/Accordion - Adds an expandable/collapsible accordion section where additional product details or faqs can be added
There is also a live preview window available for both Desktop and Mobile to help you quickly decide on the optimal layout you'd like used. Click the "Save" button once you've finished selecting your Layout elements.
In the Layout > Offers section you pick and choose which elements you want to be included for the 3-column offers section of the Buy Box:
Label - Show or hide the "Best Value" label
Product Titles - Show or hide the product title text field
Retail Price - Show or hide the product's retail price
Product Discount - Show or hide the discount field and text
Product Callouts - Show or hide the "Free Shipping" text field
Best Value Banner and Radio Button options
The "Best Value" banner can be shown on 1 of the 3 available offer columns. To edit the position, text, and style of the banner, simply click on the "Best Value" element from the page builder and then make your adjustments in the "Edit Banner Text" popup as needed:
To edit the Active and Inactive color states for the offer Radio Buttons, click on any of the radio button elements in the page builder and make your color edits in the "Radio Button Options" popup: