Once you've created the bundle offer, the last step is to position it on your website.
​

You can use the "Add To Cart" button for easy display on product pages, or use Custom Element Position or Shopify Theme 2.0 App Blocks for custom positioning. Note that the first option is only available for product pages.

Depending on the pages you choose initially, the Custom Element Position will display more lines. In other words, the app needs to know where to show the bundle offer on the selected pages.

For example, the best injection method for the case above is Custom Element Position as we’ve chosen to display our bundle on both Collection as well as product pages. This is a custom individual positioning option for bundles. In simpler terms, it's like a drag-and-drop positioning for the offer you created. This is why you need to set up a different injection for each page type.

Each bundle placed using this method is visible until the offer is disabled, and won't compete with App Blocks for visibility.

When opening the Dynamic Element Selector, we select the product’s Quantity Element as the positioning element for your bundle offer and confirm the selection. You can choose any element on the page.

The yellow borders show while you hover over elements on the page and green when you select an element. You can also use our unique Select Parent Element option to be able to select elements that are harder to select while you hover over them, such as the top product image and details 2 column area.

Once you've confirmed the element selection, make sure to choose Insert Below if you want your bundle to appear beneath the element, or Insert Above if you want it to appear above it.

After saving and launching your bundle, you can follow the redirect green button to confirm that the offer is displayed correctly on your website.

Alternatively, you can use Shopify App Blocks to display bundle offers. The first time, you may get an error message if you try to do this from the bundle creation flow, having not set this up prior. App Blocks work as global placement elements inside your sore’s theme and therefore BundleBee app blocks must be positioned first before any bundles can be displayed using this method. You can do so from the Settings page in the Bundle Bee app.

or the regular Customize option from your store theme.

You can choose to add a new section or add a new block inside an already existing section. In either scenario, from the list of available options, choose apps and select Bundle Bee Bundles Builder.

Once you’ve added the app block you can click and hold to be able to move the element and place it anywhere on the page as you can see below.

You can browse and switch between different pages in your store using the top page drop-down menu.

Once you select positioning on all pages you are interested in, you can return to the tab in which Bundle Bee was open and finish saving and launching the offer.

Assign your bundle a priority number. This will be useful when you have multiple offers set to be displayed on the same page. Bundle Bee will then select the bundle with the lowest priority number to display, instead of the others. Please note: priority 0 will be displayed above all others.

Save and Launch to confirm the app block placement on the website. We have placed app blocks on the homepage too, but this bundle will only appear on the selected pages - the collection and product pages - as shown below.

Was this article helpful? If you didn’t find what you are looking or need any extra help setting up, for please don’t hesitate to contact our support team.