Bundle Bee Offers the unique ability to display your bundles on any page in your store with no coding required.
In order to display an offer on the Homepage page, the first step is Selecting the Specific Pages option under Bundle Display. This will generate a drop-down menu where you can select from a list of all the pages in your store.
Once you are finished with the bundle creation and design, the last page ( Customize and Launch) will look slightly different. The Display Relative to Add to Cart Button positioning option will not be available. The recommended method is to position your bundle using the dynamic selector. As shown in the image below, there is now a separate line added that allows you to use the selector to position your bundle anywhere on the Homepage.
The selector behaves exactly as it would for positioning bundles on the product page. Each HTML element you hover over will be highlighted with an interrupted yellow line. Once your selection is made, confirm this in the green box at the top of the screen. For more information on using the dynamic injector, please check out this article.
Please note: In the video below, we have a uniquely identifiable element created in the theme to display the bundle. If you are using the same style of blocks multiple times on the homepage, they may have common classes or IDs and they are not a good candidate to use the custom injector since the app won’t know for sure which one of the elements with the same class or ID you want to use for injection. This often happens in the Collage block or blocks with multiple cards, such as displaying products from a collection .
Once the selection is made, you’ll be redirected to bundle creation to save and launch your offer. Clicking the green Go to Home Page button will redirect you to your storefront so that you can check the look and placement of your bundle are as expected.
Please note: If you’ve chosen to also display the bundle on product pages, this will require its own separate positioning using the selector. The dynamic selector will work as usual and redirect you to a product page so that you may position your bundle in the desired placement.
