I am trying to make a couple of things working with bundle products. But i cant seem to get it working properly. Also i cant seem to find the correct module that does this with bundle products.

What i am trying to reach is the following:

On the product page of a bundle product you have an image gallery. I want to add the product option main images to this gallery.

After that i want to be able to select a option and when i do that it updates the selected gallery image to the main image from that option.

However until this point i have searched for a solution online and inside the code. But i cant seem to figure it out how i should approach this correctly to make it all work. I was mostly testing on the gallery.php of the category/view/product folder.

If anyone knows how i can make this work i would appreciate it. Or if you know a module that does this work i would love to hear that too.

  • If you found a solution, please let me know. Im also searching for the same.
    – Thowzif
    Commented Feb 24, 2020 at 19:26

1 Answer 1


Try this code:

First you need to override below file.

After that you can get bundle option images from below code.


          <?php foreach ($_selections as $_selection): ?>
                 $_imageHelper = \Magento\Framework\App\ObjectManager::getInstance()->get('Magento\Catalog\Helper\Image');

                 $image = $_imageHelper->init($_selection, 'small_image', ['type' => 'small_image'])->keepAspectRatio(true)->resize('50', '50')->getUrl(); ?>

                    <label class="label" 
                           for="bundle-option-<?= /* @escapeNotVerified */ $_option->getId() ?>-<?= /* @escapeNotVerified */ $_selection->getSelectionId() ?>">
                        <div class="bundle-option-image"><img src="<?php echo $image; ?>" /></div>
            <?php endforeach; ?>

Hope this will works for you.

  • Thank you for answering my question. This works perfectly to show the option images on the radio fields. However what i am trying to reach is that these images that are placed here will end up with the gallery images from the bundle product itself instead of near the options. Would you have any idea on how i could make that happen? If im not clear enough, i mean with the big image and smaller images at the beginning of the product page.
    – Sprite
    Commented Jul 10, 2018 at 13:04
  • @Sprite, Just you need to move bundle-option-image div before input option. So it's render before input field. Commented Jul 10, 2018 at 13:15
  • @Sprite, If this solution is working for you then please accept answer So, others also will get an idea about this solution. Commented Jul 10, 2018 at 13:27
  • Unfortunately this solution is still not what i seek. Even if i would place it above the input field it would still not be at the correct location for where i want it. Because in my case the images have to be included in the image gallery where the normal bundle images also are loaded. Thanks for your input and help though.
    – Sprite
    Commented Jul 10, 2018 at 14:02
  • Hi @Sprite do you have found any solution on this ?
    – Sheri
    Commented Jun 23, 2021 at 0:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.