The Multi-Product Dynamic Buy Box block (MPDBB) allows you to add up to 8 products at a time. It's a fantastic block for making Collection-type pages and for achieving a better multi-product layout on both Desktop and Mobile devices:
📝A maximum of 20 unique products can be added to Buy Box blocks per Landing Page (Shopify restriction).
Adding an MPDBB to your page
The Multi-Product Dynamic Buy Box block can be found in the "Buy Boxes" section of the Page Block library:
Once you select the block, you will be presented with the next screen to add your first product:
📝The MPDBB contains the following 3 main sections, which will be covered in detail below:
Click the "Add Product" button to invoke the "Select Product" popup where all of your Shopify product inventory (available to the Online Store sales channel) will be available for selection. Select your first product by clicking on it, then click the "Next" button:
If your product has Variants, on the next screen you can choose to use them all (default), a select few, or even just one if you'd like by clicking into the "Custom" tab. Click "Next" to proceed:
📝The "Button Destination" setting for a product card needs to be either "Cart" or "Checkout" for the Variant and Quantity selector(s) to display. Placeholders will be shown in the Page Builder, actual values will be shown on the live/published page only.
Next, choose whether or not you want a Discount displayed and/or applied at Checkout for the product. There are 6 discount options available in the dropdown menu:
Click the "Confirm" button to finish adding your first product!
Repeat this process for the remaining product(s) (up to 8 products) you'd like added to the Multi-Product Dynamic Buy Box block:
Accessing Product Settings
The "Product Settings" for the Multi-Product Dynamic Buy Box block (and any other Buy Box block) can be accessed from the page editor at any time by clicking on either/or location:
Click on the 3-dots icon for a particular product to:
The "Layout" Section
In the Layout section, you have options for controlling the layout on both Desktop and Mobile devices:
The "Elements" Section
In the Elements section, you decide which elements you want to be included for all products featured in the Multi-Product Dynamic Buy Box block. Each element you choose to use is also able to be edited independently for each product card in the builder, by clicking on specific elements.
The full list of elements includes:
If the "Product Image" element is used, settings and styles for each product image featured in the block can be adjusted in the sidebar by clicking on a particular image.
There is also an option to enable a Label for each image, with additional label settings available in the sidebar after clicking on the label in the builder:
Because the Multi-Product Dynamic Buy Box block can feature multiple unique store products, it is our recommendation to disable the "Track View Content events" setting for page(s) that use this block. More details
Please reach out to us in Support Chat if you have any questions we can help with!